ultimate_turbo_modal 2.1.1 → 2.2.1

data/lib/generators/ultimate_turbo_modal/templates/flavors/tailwind3.rb

@@ -3,9 +3,9 @@
 # Tailwind CSS v3
 module UltimateTurboModal::Flavors
   class Tailwind3 < UltimateTurboModal::Base
-    DIV_DIALOG_CLASSES = "relative z-50"
+    DIV_MODAL_CONTAINER_CLASSES = "relative z-50"
     DIV_OVERLAY_CLASSES = "fixed inset-0 bg-gray-900 bg-opacity-70 transition-opacity dark:bg-gray-900 dark:bg-opacity-80"
-    DIV_OUTER_CLASSES = "fixed inset-0 overflow-y-auto sm:max-w-[80%] md:max-w-3xl sm:mx-auto m-4"
+    DIV_DIALOG_CLASSES = "fixed inset-0 overflow-y-auto sm:max-w-[80%] md:max-w-3xl sm:mx-auto m-4"
     DIV_INNER_CLASSES = "flex min-h-full items-start justify-center pt-[10vh] sm:p-4"
     DIV_CONTENT_CLASSES = "relative transform max-h-screen overflow-hidden rounded-lg bg-white text-left shadow-xl transition-all sm:my-8 sm:max-w-3xl dark:bg-gray-800 dark:text-white"
     DIV_MAIN_CLASSES = "p-4 pt-2 overflow-y-auto max-h-[75vh]"
@@ -17,5 +17,32 @@ module UltimateTurboModal::Flavors
     BUTTON_CLOSE_SR_ONLY_CLASSES = "sr-only"
     CLOSE_BUTTON_TAG_CLASSES = "text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm p-1.5 ml-auto inline-flex items-center dark:hover:bg-gray-600 dark:hover:text-white"
     ICON_CLOSE_CLASSES = "w-5 h-5"
+
+    TRANSITIONS = {
+      overlay: {
+        enter: {
+          animation: "ease-out duration-300",
+          start: "opacity-0",
+          end: "opacity-100"
+        },
+        leave: {
+          animation: "ease-in duration-200",
+          start: "opacity-100",
+          end: "opacity-0"
+        }
+      },
+      dialog: {
+        enter: {
+          animation: "ease-out duration-300",
+          start: "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95",
+          end: "opacity-100 translate-y-0 sm:scale-100"
+        },
+        leave: {
+          animation: "ease-in duration-200",
+          start: "opacity-100 translate-y-0 sm:scale-100",
+          end: "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
+        }
+      }
+    }
   end
 end

data/lib/generators/ultimate_turbo_modal/templates/flavors/vanilla.rb

@@ -3,9 +3,10 @@
 # Vanilla CSS
 module UltimateTurboModal::Flavors
   class Vanilla < UltimateTurboModal::Base
-    DIV_DIALOG_CLASSES = "modal-container"
-    DIV_OVERLAY_CLASSES = "modal-overlay"
-    DIV_OUTER_CLASSES = "modal-outer"
+    DIV_MODAL_CONTAINER_CLASSES = "modal-container"
+    # Include enter-start classes so initial paint is hidden and transitions can animate smoothly
+    DIV_OVERLAY_CLASSES = "modal-overlay modal-transition-overlay-enter-start"
+    DIV_DIALOG_CLASSES = "modal-outer modal-transition-dialog-enter-start"
     DIV_INNER_CLASSES = "modal-inner"
     DIV_CONTENT_CLASSES = "modal-content"
     DIV_MAIN_CLASSES = "modal-main"
@@ -17,5 +18,32 @@ module UltimateTurboModal::Flavors
     BUTTON_CLOSE_SR_ONLY_CLASSES = "sr-only"
     CLOSE_BUTTON_TAG_CLASSES = "modal-close-button"
     ICON_CLOSE_CLASSES = "modal-close-icon"
+    
+    TRANSITIONS = {
+      overlay: {
+        enter: {
+          animation: "modal-transition-overlay-enter-animation",
+          start: "modal-transition-overlay-enter-start",
+          end: "modal-transition-overlay-enter-end"
+        },
+        leave: {
+          animation: "modal-transition-overlay-leave-animation",
+          start: "modal-transition-overlay-leave-start",
+          end: "modal-transition-overlay-leave-end"
+        }
+      },
+      dialog: {
+        enter: {
+          animation: "modal-transition-dialog-enter-animation",
+          start: "modal-transition-dialog-enter-start",
+          end: "modal-transition-dialog-enter-end"
+        },
+        leave: {
+          animation: "modal-transition-dialog-leave-animation",
+          start: "modal-transition-dialog-leave-start",
+          end: "modal-transition-dialog-leave-end"
+        }
+      }
+    }
   end
 end

data/lib/generators/ultimate_turbo_modal/update_generator.rb

@@ -0,0 +1,97 @@
+# frozen_string_literal: true
+
+require "rails/generators"
+require "json"
+require "pathname"
+
+module UltimateTurboModal
+  module Generators
+    class UpdateGenerator < Rails::Generators::Base
+      source_root File.expand_path("templates", __dir__)
+
+      desc "Updates UltimateTurboModal: aligns npm package version to gem version and refreshes the configured flavor initializer."
+
+      def update_npm_package_version
+        package_json_path = rails_root_join("package.json")
+
+        unless File.exist?(package_json_path)
+          say "No package.json found. Skipping npm package version update.", :yellow
+          return
+        end
+
+        begin
+          json = JSON.parse(File.read(package_json_path))
+        rescue JSON::ParserError => e
+          say "Unable to parse package.json: #{e.message}", :red
+          return
+        end
+
+        package_name = "ultimate_turbo_modal"
+        new_version = UltimateTurboModal::VERSION.to_s
+
+        updated = false
+
+        %w[dependencies devDependencies].each do |section|
+          next unless json.key?(section) && json[section].is_a?(Hash)
+
+          if json[section].key?(package_name)
+            old = json[section][package_name]
+            json[section][package_name] = new_version
+            updated = true if old != new_version
+          end
+        end
+
+        if updated
+          File.write(package_json_path, JSON.pretty_generate(json) + "\n")
+          say "Updated #{package_name} version in package.json to #{new_version}.", :green
+        else
+          say "Did not find #{package_name} in package.json dependencies. Nothing to update.", :blue
+        end
+      end
+
+      def copy_flavor_file
+        flavor = detect_flavor
+        unless flavor
+          say "Could not determine UTMR flavor. Skipping flavor file copy.", :yellow
+          return
+        end
+
+        template_rel = "flavors/#{flavor}.rb"
+        template_abs = File.join(self.class.source_root, template_rel)
+
+        unless File.exist?(template_abs)
+          say "Flavor template not found for '#{flavor}' at #{template_abs}.", :red
+          return
+        end
+
+        target_path = "config/initializers/ultimate_turbo_modal_#{flavor}.rb"
+        copy_file template_rel, target_path, force: true
+        say "Copied flavor initializer to #{target_path}.", :green
+      end
+
+      private
+
+      def detect_flavor
+        command = nil
+        if File.exist?(rails_root_join("bin", "rails"))
+          command = "#{rails_root_join("bin", "rails")} runner \"puts UltimateTurboModal.configuration.flavor\""
+        else
+          command = "bundle exec rails runner \"puts UltimateTurboModal.configuration.flavor\""
+        end
+
+        output = `#{command}`
+        flavor = output.to_s.strip
+        flavor.empty? ? nil : flavor
+      rescue StandardError => e
+        say "Error determining flavor via rails runner: #{e.message}", :red
+        nil
+      end
+
+      def rails_root_join(*args)
+        Pathname.new(destination_root).join(*args)
+      end
+    end
+  end
+end
+
+

data/lib/ultimate_turbo_modal/base.rb

@@ -104,6 +104,15 @@ class UltimateTurboModal::Base < Phlex::HTML
     @advance_url || request&.original_url
   end
 
+  # Wraps yielded content in a Turbo Frame if the current request originated from a Turbo Frame
+  def maybe_turbo_frame(frame_id, &block)
+    if turbo_frame?
+      turbo_frame_tag(frame_id, &block)
+    else
+      yield
+    end
+  end
+
   def respond_to_missing?(method, include_private = false)
     self.class.included_modules.any? { |mod| mod.instance_methods.include?(method) } || super
   end
@@ -123,7 +132,7 @@ class UltimateTurboModal::Base < Phlex::HTML
 
   def styles
     style do
-      str = "html:has(dialog[open]) {overflow: hidden;} html {scrollbar-gutter: stable;}".html_safe
+      str = "html:has(dialog[open]),html:has(#modal-container) {overflow: hidden;} html {scrollbar-gutter: stable;}".html_safe
       respond_to?(:unsafe_raw) ? unsafe_raw(str) : raw(str)
     end
   end
@@ -131,7 +140,7 @@ class UltimateTurboModal::Base < Phlex::HTML
   def outer_divs(&block)
     div_dialog do
       div_overlay
-      div_outer do
+      div_outer_dialog do
         div_inner(&block)
       end
     end
@@ -144,12 +153,6 @@ class UltimateTurboModal::Base < Phlex::HTML
       modal_advance_url_value: advance_url,
       modal_allowed_click_outside_selector_value: allowed_click_outside_selector,
       action: "turbo:submit-end->modal#submitEnd keyup@window->modal#closeWithKeyboard click@window->modal#outsideModalClicked click->modal#outsideModalClicked",
-      transition_enter: "ease-out duration-100",
-      transition_enter_start: "opacity-0",
-      transition_enter_end: "opacity-100",
-      transition_leave: "ease-in duration-50",
-      transition_leave_start: "opacity-100",
-      transition_leave_end: "opacity-0",
       padding: padding?.to_s,
       title: title?.to_s,
       header: header?.to_s,
@@ -163,7 +166,7 @@ class UltimateTurboModal::Base < Phlex::HTML
     end
 
     div(id: "modal-container",
-      class: self.class::DIV_DIALOG_CLASSES,
+      class: self.class::DIV_MODAL_CONTAINER_CLASSES,
       role: "dialog",
       aria: {
         modal: true,
@@ -173,20 +176,38 @@ class UltimateTurboModal::Base < Phlex::HTML
   end
 
   def div_overlay
-    div(id: "modal-overlay", class: self.class::DIV_OVERLAY_CLASSES)
+    div(id: "modal-overlay", class: self.class::DIV_OVERLAY_CLASSES, data: {
+      modal_target: "overlay",
+      transition_enter: self.class::TRANSITIONS[:overlay][:enter][:animation],
+      transition_enter_start: self.class::TRANSITIONS[:overlay][:enter][:start],
+      transition_enter_end: self.class::TRANSITIONS[:overlay][:enter][:end],
+      transition_leave: self.class::TRANSITIONS[:overlay][:leave][:animation],
+      transition_leave_start: self.class::TRANSITIONS[:overlay][:leave][:start],
+      transition_leave_end: self.class::TRANSITIONS[:overlay][:leave][:end]
+    })
   end
 
-  def div_outer(&block)
-    div(id: "modal-outer", class: self.class::DIV_OUTER_CLASSES, &block)
+  def div_outer_dialog(&block)
+    div(id: "modal-outer", class: self.class::DIV_DIALOG_CLASSES, data: {
+      modal_target: "outer",
+      transition_enter: self.class::TRANSITIONS[:dialog][:enter][:animation],
+      transition_enter_start: self.class::TRANSITIONS[:dialog][:enter][:start],
+      transition_enter_end: self.class::TRANSITIONS[:dialog][:enter][:end],
+      transition_leave: self.class::TRANSITIONS[:dialog][:leave][:animation],
+      transition_leave_start: self.class::TRANSITIONS[:dialog][:leave][:start],
+      transition_leave_end: self.class::TRANSITIONS[:dialog][:leave][:end]
+    }, &block)
   end
 
   def div_inner(&block)
-    div(id: "modal-inner", class: self.class::DIV_INNER_CLASSES, data: content_div_data, &block)
+    maybe_turbo_frame("modal-inner") do
+      div(id: "modal-inner", class: self.class::DIV_INNER_CLASSES, data: content_div_data, &block)
+    end
   end
 
   def div_content(&block)
     data = (content_div_data || {}).merge({modal_target: "content"})
-    div(id: "modal-content", class: self.class::DIV_CONTENT_CLASSES, data:, &block)
+    div(id: "modal-content", class: self.class::DIV_CONTENT_CLASSES, data: data, &block)
   end
 
   def div_main(&block)

data/lib/ultimate_turbo_modal.rb

@@ -6,6 +6,7 @@ require "ultimate_turbo_modal/configuration"
 require "ultimate_turbo_modal/railtie"
 require "ultimate_turbo_modal/base"
 require "generators/ultimate_turbo_modal/install_generator"
+require "generators/ultimate_turbo_modal/update_generator"
 
 module UltimateTurboModal
   extend self

data/script/build_and_release.sh

@@ -23,14 +23,28 @@ if [ "$1" != "--skip-gem" ]; then
   echo "Building and releasing gem..."
   bundle exec rake build
 
-  # Check if Gemfile.lock is git dirty
-  if ! git diff --quiet Gemfile.lock; then
-    echo "Gemfile.lock is dirty. Adding, committing, and pushing."
-    git add Gemfile.lock
-    git commit -m "Update Gemfile.lock"
-    bundle exec rake build
+  # Update demo app with latest gem and JavaScript
+  echo "Updating demo app with latest code..."
+  SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
+  DEMO_APP_DIR="$SCRIPT_DIR/../demo-app"
+
+  # Build JavaScript package first
+  echo "Building ultimate_turbo_modal JavaScript package..."
+  (cd "$SCRIPT_DIR/../javascript" && yarn build)
+
+  # Update demo app dependencies
+  echo "Installing latest ultimate_turbo_modal in demo app..."
+  (cd "$DEMO_APP_DIR" && bundle install)
+  (cd "$DEMO_APP_DIR" && yarn install --force)
+
+  # Check if Gemfile.lock or demo-app files are git dirty
+  if ! git diff --quiet Gemfile.lock demo-app/Gemfile.lock demo-app/yarn.lock; then
+    echo "Lock files are dirty. Adding, committing, and pushing."
+    git add Gemfile.lock demo-app/Gemfile.lock demo-app/yarn.lock
+    git commit -m "Update lock files for demo app"
   fi
 
+  bundle exec rake build
   bundle exec rake release
 else
   echo "Skipping gem build and release..."
@@ -45,4 +59,3 @@ else
 fi
 
 echo "Done!"
-

metadata

@@ -1,13 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: ultimate_turbo_modal
 version: !ruby/object:Gem::Version
-  version: 2.1.1
+  version: 2.2.1
 platform: ruby
 authors:
 - Carl Mercier
+autorequire:
 bindir: bin
 cert_chain: []
-date: 1980-01-02 00:00:00.000000000 Z
+date: 2025-08-08 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: phlex-rails
@@ -168,102 +169,6 @@ files:
 - Rakefile
 - UPGRADING.md
 - VERSION
-- demo-app/.gitattributes
-- demo-app/.gitignore
-- demo-app/.ruby-version
-- demo-app/.tool-versions
-- demo-app/Gemfile
-- demo-app/Gemfile.lock
-- demo-app/Procfile.dev
-- demo-app/README.md
-- demo-app/Rakefile
-- demo-app/app/assets/builds/.keep
-- demo-app/app/assets/images/.keep
-- demo-app/app/assets/stylesheets/application.css
-- demo-app/app/controllers/application_controller.rb
-- demo-app/app/controllers/concerns/.keep
-- demo-app/app/controllers/concerns/set_flavor.rb
-- demo-app/app/controllers/hide_from_backends_controller.rb
-- demo-app/app/controllers/modal_controller.rb
-- demo-app/app/controllers/posts_controller.rb
-- demo-app/app/controllers/welcome_controller.rb
-- demo-app/app/helpers/application_helper.rb
-- demo-app/app/javascript/application.js
-- demo-app/app/javascript/controllers/application.js
-- demo-app/app/javascript/controllers/dark_mode_controller.js
-- demo-app/app/javascript/controllers/flash_controller.js
-- demo-app/app/javascript/controllers/hello_controller.js
-- demo-app/app/javascript/controllers/index.js
-- demo-app/app/models/application_record.rb
-- demo-app/app/models/concerns/.keep
-- demo-app/app/models/post.rb
-- demo-app/app/views/hide_from_backends/_notice.html.erb
-- demo-app/app/views/hide_from_backends/create.turbo_stream.erb
-- demo-app/app/views/hide_from_backends/new.html.erb
-- demo-app/app/views/layouts/application.html.erb
-- demo-app/app/views/modal/index.html.erb
-- demo-app/app/views/modal/show.html.erb
-- demo-app/app/views/posts/_form.html.erb
-- demo-app/app/views/posts/_post.html.erb
-- demo-app/app/views/posts/edit.html.erb
-- demo-app/app/views/posts/index.html.erb
-- demo-app/app/views/posts/new.html.erb
-- demo-app/app/views/posts/show.html.erb
-- demo-app/app/views/shared/_flash.html.erb
-- demo-app/app/views/welcome/index.html.erb
-- demo-app/bin/bundle
-- demo-app/bin/dev
-- demo-app/bin/rails
-- demo-app/bin/rake
-- demo-app/bin/setup
-- demo-app/config.ru
-- demo-app/config/application.rb
-- demo-app/config/boot.rb
-- demo-app/config/credentials.yml.enc
-- demo-app/config/database.yml
-- demo-app/config/environment.rb
-- demo-app/config/environments/development.rb
-- demo-app/config/environments/production.rb
-- demo-app/config/environments/test.rb
-- demo-app/config/initializers/assets.rb
-- demo-app/config/initializers/content_security_policy.rb
-- demo-app/config/initializers/filter_parameter_logging.rb
-- demo-app/config/initializers/inflections.rb
-- demo-app/config/initializers/new_framework_defaults_8_0.rb
-- demo-app/config/initializers/permissions_policy.rb
-- demo-app/config/initializers/ultimate_turbo_modal.rb
-- demo-app/config/initializers/ultimate_turbo_modal_tailwind.rb
-- demo-app/config/initializers/ultimate_turbo_modal_vanilla.rb
-- demo-app/config/locales/en.yml
-- demo-app/config/puma.rb
-- demo-app/config/routes.rb
-- demo-app/db/migrate/20230331002502_create_posts.rb
-- demo-app/db/migrate/20231031012703_add_post.rb
-- demo-app/db/migrate/20231128141054_add_publish_on_to_posts.rb
-- demo-app/db/schema.rb
-- demo-app/lib/assets/.keep
-- demo-app/lib/tasks/.keep
-- demo-app/log/.keep
-- demo-app/package.json
-- demo-app/postcss.config.js
-- demo-app/public/400.html
-- demo-app/public/404.html
-- demo-app/public/406-unsupported-browser.html
-- demo-app/public/422.html
-- demo-app/public/500.html
-- demo-app/public/apple-touch-icon-precomposed.png
-- demo-app/public/apple-touch-icon.png
-- demo-app/public/favicon.ico
-- demo-app/public/icon.png
-- demo-app/public/icon.svg
-- demo-app/public/img/bootstrap-logo-shadow.png
-- demo-app/public/img/unicat.jpg
-- demo-app/public/img/vanilla.png
-- demo-app/public/robots.txt
-- demo-app/tmp/.keep
-- demo-app/tmp/pids/.keep
-- demo-app/vendor/.keep
-- demo-app/yarn.lock
 - javascript/index.js
 - javascript/modal_controller.js
 - javascript/package.json
@@ -278,6 +183,7 @@ files:
 - lib/generators/ultimate_turbo_modal/templates/flavors/tailwind3.rb
 - lib/generators/ultimate_turbo_modal/templates/flavors/vanilla.rb
 - lib/generators/ultimate_turbo_modal/templates/ultimate_turbo_modal.rb
+- lib/generators/ultimate_turbo_modal/update_generator.rb
 - lib/phlex/deferred_render_with_main_content.rb
 - lib/ultimate_turbo_modal.rb
 - lib/ultimate_turbo_modal/base.rb
@@ -297,6 +203,7 @@ metadata:
   homepage_uri: https://github.com/cmer/ultimate_turbo_modal
   source_code_uri: https://github.com/cmer/ultimate_turbo_modal
   changelog_uri: https://github.com/cmer/ultimate_turbo_modal/CHANGELOG.md
+post_install_message:
 rdoc_options: []
 require_paths:
 - lib
@@ -311,7 +218,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.6.7
+rubygems_version: 3.5.22
+signing_key:
 specification_version: 4
 summary: UTMR aims to be the be-all and end-all of Turbo Modals.
 test_files: []

data/demo-app/.gitattributes

@@ -1,7 +0,0 @@
-# See https://git-scm.com/docs/gitattributes for more about git attribute files.
-
-# Mark the database schema as having been generated.
-db/schema.rb linguist-generated
-
-# Mark any vendored files as having been vendored.
-vendor/* linguist-vendored

data/demo-app/.gitignore

@@ -1,34 +0,0 @@
-# See https://help.github.com/articles/ignoring-files for more about ignoring files.
-#
-# If you find yourself ignoring temporary files generated by your text editor
-# or operating system, you probably want to add a global ignore instead:
-#   git config --global core.excludesfile '~/.gitignore_global'
-
-# Ignore bundler config.
-/.bundle
-
-# Ignore the default SQLite database.
-/db/*.sqlite3
-/db/*.sqlite3-*
-
-# Ignore all logfiles and tempfiles.
-/log/*
-/tmp/*
-!/log/.keep
-!/tmp/.keep
-
-# Ignore pidfiles, but keep the directory.
-/tmp/pids/*
-!/tmp/pids/
-!/tmp/pids/.keep
-
-
-/public/assets
-
-# Ignore master key for decrypting credentials and more.
-/config/master.key
-
-/app/assets/builds/*
-!/app/assets/builds/.keep
-
-/node_modules

data/demo-app/.ruby-version

@@ -1 +0,0 @@
-ruby-3.3.9

data/demo-app/.tool-versions

@@ -1,2 +0,0 @@
-ruby 3.3.9
-nodejs 22.14.0

data/demo-app/Gemfile

@@ -1,41 +0,0 @@
-source "https://rubygems.org"
-git_source(:github) { |repo| "https://github.com/#{repo}.git" }
-
-ruby file: ".tool-versions"
-
-# Bundle edge Rails instead: gem "rails", github: "rails/rails", branch: "main"
-gem "rails", "~> 8.0.2"
-
-# The modern asset pipeline for Rails [https://github.com/rails/propshaft]
-gem "propshaft"
-
-# Hotwire's SPA-like page accelerator [https://turbo.hotwired.dev]
-gem "turbo-rails"
-
-# Hotwire's modest JavaScript framework [https://stimulus.hotwired.dev]
-gem "stimulus-rails"
-
-# Use sqlite3 as the database for Active Record
-gem "sqlite3"
-
-# Use the Puma web server [https://github.com/puma/puma]
-gem "puma", "~> 6.6"
-
-# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
-gem "tzinfo-data", platforms: %i[ mingw mswin x64_mingw jruby ]
-
-group :development, :test do
-  # See https://guides.rubyonrails.org/debugging_rails_applications.html#debugging-with-the-debug-gem
-  gem "debug", platforms: %i[ mri mingw x64_mingw ]
-  gem "web-console"
-end
-
-group :development do
-  # Speed up commands on slow machines / big apps [https://github.com/rails/spring]
-  # gem "spring"
-end
-
-gem "cssbundling-rails"
-gem "jsbundling-rails"
-gem "faker"
-gem "ultimate_turbo_modal", path: "../"