swal_rails 0.3.1.beta1

data/Rakefile

@@ -0,0 +1,12 @@
+# frozen_string_literal: true
+
+require "bundler/gem_tasks"
+require "rspec/core/rake_task"
+
+RSpec::Core::RakeTask.new(:spec)
+
+require "rubocop/rake_task"
+
+RuboCop::RakeTask.new
+
+task default: %i[spec rubocop]

data/app/assets/javascripts/swal_rails/chain.js

@@ -0,0 +1,38 @@
+// Runs a sequence of SweetAlert2 modals, advancing only on confirm.
+//
+// Semantics (per step):
+//   - isDismissed → abort the chain, return false
+//   - isConfirmed → run onConfirmed sub-chain if present, else continue
+//   - isDenied    → run onDenied sub-chain if present, else abort
+//
+// A chain resolves to `true` iff it ran to completion along a path without
+// abort. That boolean is the contract expected by Turbo.setConfirmMethod
+// and by the data-attribute re-dispatch logic in confirm.js.
+export const CHAIN_DEFAULTS = {
+  showCancelButton: true,
+  focusCancel: true,
+  icon: "warning"
+}
+
+export const chainDialogs = async (Swal, steps) => {
+  if (!Array.isArray(steps) || steps.length === 0) return true
+
+  for (const step of steps) {
+    // Strip our own control keys — SA2 ignores unknown options, but leaking
+    // `onConfirmed`/`onDenied` into the popup options keeps the serialized
+    // payload noisy and invites confusion.
+    const { onConfirmed, onDenied, ...sa2Options } = step || {}
+    const result = await Swal.fire({ ...CHAIN_DEFAULTS, ...sa2Options })
+
+    if (result.isDismissed) return false
+    if (result.isConfirmed) {
+      if (Array.isArray(onConfirmed)) return chainDialogs(Swal, onConfirmed)
+      continue
+    }
+    if (result.isDenied) {
+      if (Array.isArray(onDenied)) return chainDialogs(Swal, onDenied)
+      return false
+    }
+  }
+  return true
+}

data/app/assets/javascripts/swal_rails/confirm.js

@@ -0,0 +1,93 @@
+import { chainDialogs } from "swal_rails/chain"
+
+const parseJSON = (value) => {
+  if (!value) return null
+  try { return JSON.parse(value) } catch { return null }
+}
+
+// When Rails serializes `data: { turbo_confirm: { icon: "error" } }`, the
+// attribute value is a JSON string. Detect that, and accept both Object
+// (single-step options) and Array (multi-step chain) shapes.
+const messagePayload = (message) => {
+  if (typeof message !== "string") return null
+  const trimmed = message.trim()
+  if (trimmed[0] !== "{" && trimmed[0] !== "[") return null
+  const parsed = parseJSON(trimmed)
+  if (Array.isArray(parsed)) return parsed
+  if (parsed && typeof parsed === "object") return parsed
+  return null
+}
+
+const confirmDialog = (Swal, message, element) => {
+  const dataset = element?.dataset || {}
+  const payload = messagePayload(message)
+  const fromMessage = payload && !Array.isArray(payload) ? payload : null
+  const text = fromMessage ? undefined : message
+
+  const options = {
+    title: dataset.swalTitle || text || "Are you sure?",
+    text: dataset.swalText || (dataset.swalTitle ? text : undefined),
+    icon: dataset.swalIcon || "warning",
+    showCancelButton: true,
+    focusCancel: true
+  }
+  if (dataset.swalConfirmText) options.confirmButtonText = dataset.swalConfirmText
+  if (dataset.swalCancelText) options.cancelButtonText = dataset.swalCancelText
+
+  // Merge order (later wins): defaults → data-swal-* shortcuts → JSON message
+  // (turbo_confirm: {}) → data-swal-options (most specific).
+  const extras = parseJSON(dataset.swalOptions) || {}
+  return Swal.fire({ ...options, ...(fromMessage || {}), ...extras }).then((result) => result.isConfirmed)
+}
+
+// Dispatches to either a multi-step chain or a single-step confirm. Called
+// from both the Turbo override and the data-attribute listener so both
+// paths behave identically.
+const confirmFlow = (Swal, message, element) => {
+  const fromDataset = parseJSON(element?.dataset?.swalSteps)
+  if (Array.isArray(fromDataset) && fromDataset.length) return chainDialogs(Swal, fromDataset)
+
+  const payload = messagePayload(message)
+  if (Array.isArray(payload) && payload.length) return chainDialogs(Swal, payload)
+
+  return confirmDialog(Swal, message, element)
+}
+
+const installTurboOverride = (Swal) => {
+  if (typeof window.Turbo === "undefined" || !window.Turbo.setConfirmMethod) return false
+
+  window.Turbo.setConfirmMethod((message, element) => confirmFlow(Swal, message, element))
+  return true
+}
+
+const installDataAttribute = (Swal) => {
+  const handler = (event) => {
+    const el = event.target.closest("[data-swal-confirm], [data-swal-steps]")
+    if (!el) return
+    const message = el.getAttribute("data-swal-confirm")
+    event.preventDefault()
+    event.stopPropagation()
+    confirmFlow(Swal, message, el).then((confirmed) => {
+      if (!confirmed) return
+      el.removeAttribute("data-swal-confirm")
+      el.removeAttribute("data-swal-steps")
+      if (typeof el.click === "function" && event.type === "click") {
+        el.click()
+      } else if (el.tagName === "FORM") {
+        // requestSubmit() fires the 'submit' event, so Turbo and any UJS
+        // handlers stay in the loop — unlike the raw .submit() which skips them.
+        if (typeof el.requestSubmit === "function") el.requestSubmit()
+        else el.submit()
+      }
+    })
+  }
+  document.addEventListener("click", handler, true)
+  document.addEventListener("submit", handler, true)
+}
+
+export const installConfirm = (Swal, config) => {
+  const mode = config.confirmMode || "data_attribute"
+  if (mode === "off") return
+  if (mode === "turbo_override" || mode === "both") installTurboOverride(Swal)
+  if (mode === "data_attribute" || mode === "both") installDataAttribute(Swal)
+}

data/app/assets/javascripts/swal_rails/controllers/swal_controller.js

@@ -0,0 +1,54 @@
+import { Controller } from "@hotwired/stimulus"
+import Swal from "sweetalert2"
+import { chainDialogs } from "swal_rails/chain"
+
+// Fire a Swal modal/toast or a multi-step chain from markup.
+//
+// <button data-controller="swal"
+//         data-action="click->swal#fire"
+//         data-swal-options-value='{"title":"Hi","icon":"info"}'>
+//   Ping
+// </button>
+//
+// <button data-controller="swal"
+//         data-action="click->swal#chain"
+//         data-swal-steps-value='[{"title":"Sure?"},{"title":"Really?"}]'>
+//   Ping
+// </button>
+export default class extends Controller {
+  static values = {
+    options: { type: Object, default: {} },
+    steps: { type: Array, default: [] }
+  }
+
+  fire(event) {
+    if (this.element.tagName === "A" || this.element.tagName === "BUTTON") {
+      event?.preventDefault?.()
+    }
+    return Swal.fire(this.optionsValue)
+  }
+
+  confirm(event) {
+    event?.preventDefault?.()
+    const form = event?.target?.closest?.("form") || this.element
+    Swal.fire({
+      showCancelButton: true,
+      focusCancel: true,
+      ...this.optionsValue
+    }).then((result) => {
+      if (result.isConfirmed && form?.tagName === "FORM") {
+        typeof form.requestSubmit === "function" ? form.requestSubmit() : form.submit()
+      }
+    })
+  }
+
+  async chain(event) {
+    event?.preventDefault?.()
+    const form = event?.target?.closest?.("form") || this.element
+    const ok = await chainDialogs(window.Swal || Swal, this.stepsValue)
+    if (ok && form?.tagName === "FORM") {
+      typeof form.requestSubmit === "function" ? form.requestSubmit() : form.submit()
+    }
+    return ok
+  }
+}

data/app/assets/javascripts/swal_rails/flash.js

@@ -0,0 +1,24 @@
+const readFlash = () => {
+  const el = document.querySelector('meta[name="swal-flash"]')
+  if (!el) return []
+  try { return JSON.parse(el.getAttribute("content")) || [] } catch { return [] }
+}
+
+export const installFlash = (Swal, config) => {
+  const flashes = readFlash()
+  if (!flashes.length) return
+
+  const map = config.flashMap || {}
+  const queue = flashes.map((flash) => {
+    const spec = map[flash.key] || map[flash.key.toLowerCase()] || { icon: "info", toast: true, position: "top-end", timer: 3000 }
+    // Per-request options win over the per-key defaults from flash_map.
+    return { ...spec, ...(flash.options || {}) }
+  })
+
+  const fireNext = () => {
+    const opts = queue.shift()
+    if (!opts) return
+    Swal.fire(opts).then(fireNext)
+  }
+  fireNext()
+}

data/app/assets/javascripts/swal_rails/index.js

@@ -0,0 +1,62 @@
+import Swal from "sweetalert2"
+import { installConfirm } from "swal_rails/confirm"
+import { installFlash } from "swal_rails/flash"
+
+const readMeta = (name) => {
+  const el = document.querySelector(`meta[name="${name}"]`)
+  if (!el) return null
+  try { return JSON.parse(el.getAttribute("content")) } catch { return null }
+}
+
+const prefersReducedMotion = () =>
+  window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches
+
+const buildMixin = (config) => {
+  const base = { ...(config.defaultOptions || {}) }
+  if (config.respectReducedMotion && prefersReducedMotion()) {
+    base.showClass = { popup: "" }
+    base.hideClass = { popup: "" }
+  }
+  if (config.i18n?.confirm_button_text) base.confirmButtonText = config.i18n.confirm_button_text
+  if (config.i18n?.cancel_button_text) base.cancelButtonText = config.i18n.cancel_button_text
+  if (config.i18n?.deny_button_text) base.denyButtonText = config.i18n.deny_button_text
+  if (config.i18n?.close_button_aria_label) base.closeButtonAriaLabel = config.i18n.close_button_aria_label
+  return base
+}
+
+// Module-scoped so repeated calls to boot() (DOMContentLoaded + every
+// turbo:load) don't stack a new click/submit listener per navigation.
+let booted = null
+
+const boot = () => {
+  if (!booted) {
+    const config = readMeta("swal-config") || {}
+    const Mixin = Swal.mixin(buildMixin(config))
+
+    if (config.exposeWindowSwal !== false) {
+      window.Swal = Mixin
+    }
+
+    installConfirm(Mixin, config)
+    booted = { Swal: Mixin, config }
+    document.dispatchEvent(new CustomEvent("swal-rails:ready", { detail: booted }))
+  }
+
+  // Flash meta is re-rendered per request, so read and fire on every page.
+  installFlash(booted.Swal, booted.config)
+  return booted.Swal
+}
+
+const ready = (fn) => {
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", fn, { once: true })
+  } else {
+    fn()
+  }
+}
+
+ready(boot)
+document.addEventListener("turbo:load", boot)
+
+export { Swal }
+export default Swal

data/app/assets/stylesheets/swal_rails/index.css

@@ -0,0 +1,5 @@
+/*
+ * swal_rails stylesheet entrypoint.
+ * Imports the vendored SweetAlert2 CSS; override variables in your own stylesheet.
+ */
+@import "sweetalert2.css";

data/config/importmap.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+pin "sweetalert2", to: "sweetalert2.esm.all.js"
+pin "swal_rails", to: "swal_rails/index.js"
+pin "swal_rails/confirm", to: "swal_rails/confirm.js"
+pin "swal_rails/flash", to: "swal_rails/flash.js"
+pin "swal_rails/chain", to: "swal_rails/chain.js"
+pin_all_from SwalRails::Engine.root.join("app/assets/javascripts/swal_rails/controllers"),
+             under: "controllers", to: "swal_rails/controllers"

data/config/locales/swal_rails.en.yml

@@ -0,0 +1,19 @@
+en:
+  swal_rails:
+    confirm_button_text: "OK"
+    cancel_button_text: "Cancel"
+    deny_button_text: "No"
+    close_button_aria_label: "Close this dialog"
+    confirm:
+      title: "Are you sure?"
+      confirm_button_text: "Yes"
+      cancel_button_text: "Cancel"
+    flash:
+      success:
+        title: "Success"
+      error:
+        title: "Error"
+      warning:
+        title: "Warning"
+      info:
+        title: "Info"

data/config/locales/swal_rails.fr.yml

@@ -0,0 +1,19 @@
+fr:
+  swal_rails:
+    confirm_button_text: "OK"
+    cancel_button_text: "Annuler"
+    deny_button_text: "Non"
+    close_button_aria_label: "Fermer cette fenêtre"
+    confirm:
+      title: "Êtes-vous sûr ?"
+      confirm_button_text: "Oui"
+      cancel_button_text: "Annuler"
+    flash:
+      success:
+        title: "Succès"
+      error:
+        title: "Erreur"
+      warning:
+        title: "Attention"
+      info:
+        title: "Info"

data/gemfiles/rails_7_2.gemfile

@@ -0,0 +1,25 @@
+# This file was generated by Appraisal
+
+source "https://rubygems.org"
+
+gem "irb"
+gem "rake", "~> 13.0"
+gem "importmap-rails", "~> 2.0"
+gem "propshaft", "~> 0.9"
+gem "rails", "~> 7.2.2"
+gem "stimulus-rails", "~> 1.3"
+gem "turbo-rails", "~> 2.0"
+
+group :development, :test do
+  gem "appraisal", "~> 2.5"
+  gem "capybara", "~> 3.40"
+  gem "cuprite", "~> 0.15"
+  gem "puma", "~> 6.4"
+  gem "rspec", "~> 3.12"
+  gem "rspec-rails", "~> 6.1"
+  gem "rubocop", "~> 1.60", require: false
+  gem "rubocop-rspec", require: false
+  gem "sqlite3", "~> 1.7"
+end
+
+gemspec path: "../"

data/gemfiles/rails_8_0.gemfile

@@ -0,0 +1,25 @@
+# This file was generated by Appraisal
+
+source "https://rubygems.org"
+
+gem "irb"
+gem "rake", "~> 13.0"
+gem "importmap-rails", "~> 2.0"
+gem "propshaft", "~> 1.0"
+gem "rails", "~> 8.0.0"
+gem "stimulus-rails", "~> 1.3"
+gem "turbo-rails", "~> 2.0"
+
+group :development, :test do
+  gem "appraisal", "~> 2.5"
+  gem "capybara", "~> 3.40"
+  gem "cuprite", "~> 0.15"
+  gem "puma", "~> 6.4"
+  gem "rspec", "~> 3.12"
+  gem "rspec-rails", "~> 6.1"
+  gem "rubocop", "~> 1.60", require: false
+  gem "rubocop-rspec", require: false
+  gem "sqlite3", "~> 1.7"
+end
+
+gemspec path: "../"

data/gemfiles/rails_8_1.gemfile

@@ -0,0 +1,25 @@
+# This file was generated by Appraisal
+
+source "https://rubygems.org"
+
+gem "irb"
+gem "rake", "~> 13.0"
+gem "importmap-rails", "~> 2.0"
+gem "propshaft", "~> 1.0"
+gem "rails", "~> 8.1.3"
+gem "stimulus-rails", "~> 1.3"
+gem "turbo-rails", "~> 2.0"
+
+group :development, :test do
+  gem "appraisal", "~> 2.5"
+  gem "capybara", "~> 3.40"
+  gem "cuprite", "~> 0.15"
+  gem "puma", "~> 6.4"
+  gem "rspec", "~> 3.12"
+  gem "rspec-rails", "~> 6.1"
+  gem "rubocop", "~> 1.60", require: false
+  gem "rubocop-rspec", require: false
+  gem "sqlite3", "~> 1.7"
+end
+
+gemspec path: "../"

data/gemfiles/rails_8_1_sprockets.gemfile

@@ -0,0 +1,25 @@
+# This file was generated by Appraisal
+
+source "https://rubygems.org"
+
+gem "irb"
+gem "rake", "~> 13.0"
+gem "importmap-rails", "~> 2.0"
+gem "rails", "~> 8.1.3"
+gem "stimulus-rails", "~> 1.3"
+gem "turbo-rails", "~> 2.0"
+gem "sprockets-rails", "~> 3.5"
+
+group :development, :test do
+  gem "appraisal", "~> 2.5"
+  gem "capybara", "~> 3.40"
+  gem "cuprite", "~> 0.15"
+  gem "puma", "~> 6.4"
+  gem "rspec", "~> 3.12"
+  gem "rspec-rails", "~> 6.1"
+  gem "rubocop", "~> 1.60", require: false
+  gem "rubocop-rspec", require: false
+  gem "sqlite3", "~> 1.7"
+end
+
+gemspec path: "../"

data/lib/generators/swal_rails/install/install_generator.rb

@@ -0,0 +1,138 @@
+# frozen_string_literal: true
+
+require "rails/generators"
+require "rails/generators/base"
+
+module SwalRails
+  module Generators
+    class InstallGenerator < Rails::Generators::Base
+      source_root File.expand_path("templates", __dir__)
+
+      ASSETS_MODES = %w[importmap jsbundling sprockets auto].freeze
+
+      # `--mode` is used instead of `--assets` because Rails::Generators::Base
+      # reserves `:assets` as a boolean option (legacy `rails new --skip-assets`).
+      class_option :mode, type: :string, default: "auto", desc: "Asset mode: importmap, jsbundling, sprockets, auto"
+      class_option :confirm_mode, type: :string, default: "data_attribute", desc: "Confirm mode: off, data_attribute, turbo_override, both"
+      class_option :skip_layout, type: :boolean, default: false, desc: "Skip layout injection"
+
+      def validate_options!
+        mode = (options[:mode] || "auto").to_s
+        return if ASSETS_MODES.include?(mode)
+
+        raise Thor::Error, "--mode must be one of #{ASSETS_MODES.join(", ")}"
+      end
+
+      def copy_initializer
+        template "initializer.rb", "config/initializers/swal_rails.rb"
+      end
+
+      def configure_assets
+        case resolved_assets_mode
+        when "importmap"  then install_importmap
+        when "jsbundling" then install_jsbundling
+        when "sprockets"  then install_sprockets
+        end
+      end
+
+      def inject_meta_tags
+        return if options[:skip_layout]
+
+        layout = "app/views/layouts/application.html.erb"
+        return say_status(:skip, "#{layout} not found", :yellow) unless file_exists?(layout)
+
+        inject_into_file layout, before: %r{</head>} do
+          "    <%= swal_rails_meta_tags %>\n  "
+        end
+      end
+
+      def show_readme
+        readme_text = <<~TXT
+
+          swal_rails installed.
+
+          Next steps:
+            1. Edit config/initializers/swal_rails.rb to customize flash_map / confirm_mode.
+            2. Ensure <%= swal_rails_meta_tags %> is rendered in your <head>.
+            3. Import the runtime in your JS entrypoint:
+                 import "swal_rails"
+
+          Confirm mode: #{options[:confirm_mode]}
+          Assets mode:  #{resolved_assets_mode}
+        TXT
+        say readme_text, :green
+      end
+
+      private
+
+      def resolved_assets_mode
+        @resolved_assets_mode ||= detect_assets_mode
+      end
+
+      def detect_assets_mode
+        mode = (options[:mode] || "auto").to_s
+        return mode unless mode == "auto"
+        return "importmap"  if file_exists?("config/importmap.rb")
+        return "jsbundling" if file_exists?("package.json")
+
+        "sprockets"
+      end
+
+      def install_importmap
+        pin_line = 'pin "swal_rails", to: "swal_rails/index.js"'
+        pin_sa2  = 'pin "sweetalert2", to: "sweetalert2.esm.all.js"'
+
+        if file_exists?("config/importmap.rb")
+          append_unique "config/importmap.rb", pin_sa2
+          append_unique "config/importmap.rb", pin_line
+        else
+          say_status(:warn, "config/importmap.rb not found, skipping pins", :yellow)
+        end
+
+        app_js = "app/javascript/application.js"
+        if file_exists?(app_js)
+          append_unique app_js, 'import "swal_rails"'
+        else
+          say_status(:warn, "#{app_js} not found, add `import \"swal_rails\"` to your JS entrypoint", :yellow)
+        end
+      end
+
+      def install_jsbundling
+        if file_exists?("package.json")
+          run "yarn add sweetalert2@#{SwalRails::SWEETALERT2_VERSION}" if file_exists?("yarn.lock")
+          run "npm install sweetalert2@#{SwalRails::SWEETALERT2_VERSION}" if file_exists?("package-lock.json") && !file_exists?("yarn.lock")
+        else
+          say_status(:warn, "package.json not found", :yellow)
+        end
+
+        app_js = "app/javascript/application.js"
+        if file_exists?(app_js)
+          append_unique app_js, 'import "swal_rails"'
+        else
+          say_status(:warn, "#{app_js} not found", :yellow)
+        end
+      end
+
+      def install_sprockets
+        manifest = "app/assets/config/manifest.js"
+        if file_exists?(manifest)
+          append_unique manifest, "//= link sweetalert2.js"
+          append_unique manifest, "//= link sweetalert2.css"
+        else
+          say_status(:warn, "#{manifest} not found; add `//= require sweetalert2` to your bundle", :yellow)
+        end
+      end
+
+      def append_unique(path, line)
+        content = File.read(File.join(destination_root, path))
+        return if content.include?(line)
+
+        append_to_file path, "\n#{line}\n"
+      end
+
+      def file_exists?(path)
+        File.exist?(File.join(destination_root, path))
+      end
+    end
+  end
+end

data/lib/generators/swal_rails/install/templates/initializer.rb

@@ -0,0 +1,33 @@
+# frozen_string_literal: true
+
+SwalRails.configure do |config|
+  # How confirmation modals are wired.
+  #   :off             — do nothing, use Swal manually
+  #   :data_attribute  — intercept clicks/submits on [data-swal-confirm] (default, non-intrusive)
+  #   :turbo_override  — replace Turbo.setConfirmMethod globally
+  #   :both            — both mechanisms at once
+  config.confirm_mode = :<%= options[:confirm_mode] %>
+
+  # Whether to expose `window.Swal` globally (useful for console / inline scripts).
+  config.expose_window_swal = true
+
+  # Whether to honor the user's OS prefers-reduced-motion setting.
+  config.respect_reduced_motion = true
+
+  # Default options merged into every Swal.fire call.
+  config.default_options = {
+    buttonsStyling: true,
+    reverseButtons: false,
+    focusConfirm: true,
+    returnFocus: true
+  }
+
+  # Map Rails flash keys to SweetAlert2 options.
+  # Set a key to nil to silence it. Customize icon/toast/position/timer per key.
+  config.flash_map[:notice]  = { icon: "success", toast: true,  position: "top-end", timer: 3000, timerProgressBar: true, showConfirmButton: false }
+  config.flash_map[:success] = { icon: "success", toast: true,  position: "top-end", timer: 3000, timerProgressBar: true, showConfirmButton: false }
+  config.flash_map[:alert]   = { icon: "error",   toast: false }
+  config.flash_map[:error]   = { icon: "error",   toast: false }
+  config.flash_map[:warning] = { icon: "warning", toast: true,  position: "top-end", timer: 4000, timerProgressBar: true, showConfirmButton: false }
+  config.flash_map[:info]    = { icon: "info",    toast: true,  position: "top-end", timer: 3000, timerProgressBar: true, showConfirmButton: false }
+end

data/lib/generators/swal_rails/locales/locales_generator.rb

@@ -0,0 +1,19 @@
+# frozen_string_literal: true
+
+require "rails/generators/base"
+
+module SwalRails
+  module Generators
+    class LocalesGenerator < Rails::Generators::Base
+      source_root File.expand_path("../../../../config/locales", __dir__)
+
+      desc "Copies swal_rails locale files (en, fr) into config/locales/"
+
+      def copy_locales
+        Dir["#{self.class.source_root}/*.yml"].each do |file|
+          copy_file file, "config/locales/#{File.basename(file)}"
+        end
+      end
+    end
+  end
+end