stimulus_reflex 3.5.0.pre10 → 3.5.0.rc1

data/app/assets/javascripts/stimulus_reflex.umd.js

@@ -1,8 +1,284 @@
 (function(global, factory) {
-  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("@hotwired/stimulus"), require("@rails/actioncable"), require("cable_ready")) : typeof define === "function" && define.amd ? define([ "exports", "@hotwired/stimulus", "@rails/actioncable", "cable_ready" ], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, 
-  factory(global.StimulusReflex = {}, global.Stimulus, global.ActionCable, global.CableReady));
-})(this, (function(exports, stimulus, actioncable, CableReady) {
+  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("@hotwired/stimulus"), require("cable_ready"), require("@rails/actioncable")) : typeof define === "function" && define.amd ? define([ "exports", "@hotwired/stimulus", "cable_ready", "@rails/actioncable" ], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, 
+  factory(global.StimulusReflex = {}, global.Stimulus, global.CableReady, global.ActionCable));
+})(this, (function(exports, stimulus, CableReady, actioncable) {
   "use strict";
+  /*!
+   * Toastify js 1.12.0
+   * https://github.com/apvarun/toastify-js
+   * @license MIT licensed
+   *
+   * Copyright (C) 2018 Varun A P
+   */  class Toastify {
+    defaults={
+      oldestFirst: true,
+      text: "Toastify is awesome!",
+      node: undefined,
+      duration: 3e3,
+      selector: undefined,
+      callback: function() {},
+      destination: undefined,
+      newWindow: false,
+      close: false,
+      gravity: "toastify-top",
+      positionLeft: false,
+      position: "",
+      backgroundColor: "",
+      avatar: "",
+      className: "",
+      stopOnFocus: true,
+      onClick: function() {},
+      offset: {
+        x: 0,
+        y: 0
+      },
+      escapeMarkup: true,
+      ariaLive: "polite",
+      style: {
+        background: ""
+      }
+    };
+    constructor(options) {
+      this.version = "1.12.0";
+      this.options = {};
+      this.toastElement = null;
+      this._rootElement = document.body;
+      this._init(options);
+    }
+    showToast() {
+      this.toastElement = this._buildToast();
+      if (typeof this.options.selector === "string") {
+        this._rootElement = document.getElementById(this.options.selector);
+      } else if (this.options.selector instanceof HTMLElement || this.options.selector instanceof ShadowRoot) {
+        this._rootElement = this.options.selector;
+      } else {
+        this._rootElement = document.body;
+      }
+      if (!this._rootElement) {
+        throw "Root element is not defined";
+      }
+      this._rootElement.insertBefore(this.toastElement, this._rootElement.firstChild);
+      this._reposition();
+      if (this.options.duration > 0) {
+        this.toastElement.timeOutValue = window.setTimeout((() => {
+          this._removeElement(this.toastElement);
+        }), this.options.duration);
+      }
+      return this;
+    }
+    hideToast() {
+      if (this.toastElement.timeOutValue) {
+        clearTimeout(this.toastElement.timeOutValue);
+      }
+      this._removeElement(this.toastElement);
+    }
+    _init(options) {
+      this.options = Object.assign(this.defaults, options);
+      if (this.options.backgroundColor) {
+        console.warn('DEPRECATION NOTICE: "backgroundColor" is being deprecated. Please use the "style.background" property.');
+      }
+      this.toastElement = null;
+      this.options.gravity = options.gravity === "bottom" ? "toastify-bottom" : "toastify-top";
+      this.options.stopOnFocus = options.stopOnFocus === undefined ? true : options.stopOnFocus;
+      if (options.backgroundColor) {
+        this.options.style.background = options.backgroundColor;
+      }
+    }
+    _buildToast() {
+      if (!this.options) {
+        throw "Toastify is not initialized";
+      }
+      let divElement = document.createElement("div");
+      divElement.className = `toastify on ${this.options.className}`;
+      divElement.className += ` toastify-${this.options.position}`;
+      divElement.className += ` ${this.options.gravity}`;
+      for (const property in this.options.style) {
+        divElement.style[property] = this.options.style[property];
+      }
+      if (this.options.ariaLive) {
+        divElement.setAttribute("aria-live", this.options.ariaLive);
+      }
+      if (this.options.node && this.options.node.nodeType === Node.ELEMENT_NODE) {
+        divElement.appendChild(this.options.node);
+      } else {
+        if (this.options.escapeMarkup) {
+          divElement.innerText = this.options.text;
+        } else {
+          divElement.innerHTML = this.options.text;
+        }
+        if (this.options.avatar !== "") {
+          let avatarElement = document.createElement("img");
+          avatarElement.src = this.options.avatar;
+          avatarElement.className = "toastify-avatar";
+          if (this.options.position == "left") {
+            divElement.appendChild(avatarElement);
+          } else {
+            divElement.insertAdjacentElement("afterbegin", avatarElement);
+          }
+        }
+      }
+      if (this.options.close === true) {
+        let closeElement = document.createElement("button");
+        closeElement.type = "button";
+        closeElement.setAttribute("aria-label", "Close");
+        closeElement.className = "toast-close";
+        closeElement.innerHTML = "✖";
+        closeElement.addEventListener("click", (event => {
+          event.stopPropagation();
+          this._removeElement(this.toastElement);
+          window.clearTimeout(this.toastElement.timeOutValue);
+        }));
+        const width = window.innerWidth > 0 ? window.innerWidth : screen.width;
+        if (this.options.position == "left" && width > 360) {
+          divElement.insertAdjacentElement("afterbegin", closeElement);
+        } else {
+          divElement.appendChild(closeElement);
+        }
+      }
+      if (this.options.stopOnFocus && this.options.duration > 0) {
+        divElement.addEventListener("mouseover", (event => {
+          window.clearTimeout(divElement.timeOutValue);
+        }));
+        divElement.addEventListener("mouseleave", (() => {
+          divElement.timeOutValue = window.setTimeout((() => {
+            this._removeElement(divElement);
+          }), this.options.duration);
+        }));
+      }
+      if (typeof this.options.destination !== "undefined") {
+        divElement.addEventListener("click", (event => {
+          event.stopPropagation();
+          if (this.options.newWindow === true) {
+            window.open(this.options.destination, "_blank");
+          } else {
+            window.location = this.options.destination;
+          }
+        }));
+      }
+      if (typeof this.options.onClick === "function" && typeof this.options.destination === "undefined") {
+        divElement.addEventListener("click", (event => {
+          event.stopPropagation();
+          this.options.onClick();
+        }));
+      }
+      if (typeof this.options.offset === "object") {
+        const x = this._getAxisOffsetAValue("x", this.options);
+        const y = this._getAxisOffsetAValue("y", this.options);
+        const xOffset = this.options.position == "left" ? x : `-${x}`;
+        const yOffset = this.options.gravity == "toastify-top" ? y : `-${y}`;
+        divElement.style.transform = `translate(${xOffset},${yOffset})`;
+      }
+      return divElement;
+    }
+    _removeElement(toastElement) {
+      toastElement.className = toastElement.className.replace(" on", "");
+      window.setTimeout((() => {
+        if (this.options.node && this.options.node.parentNode) {
+          this.options.node.parentNode.removeChild(this.options.node);
+        }
+        if (toastElement.parentNode) {
+          toastElement.parentNode.removeChild(toastElement);
+        }
+        this.options.callback.call(toastElement);
+        this._reposition();
+      }), 400);
+    }
+    _reposition() {
+      let topLeftOffsetSize = {
+        top: 15,
+        bottom: 15
+      };
+      let topRightOffsetSize = {
+        top: 15,
+        bottom: 15
+      };
+      let offsetSize = {
+        top: 15,
+        bottom: 15
+      };
+      let allToasts = this._rootElement.querySelectorAll(".toastify");
+      let classUsed;
+      for (let i = 0; i < allToasts.length; i++) {
+        if (allToasts[i].classList.contains("toastify-top") === true) {
+          classUsed = "toastify-top";
+        } else {
+          classUsed = "toastify-bottom";
+        }
+        let height = allToasts[i].offsetHeight;
+        classUsed = classUsed.substr(9, classUsed.length - 1);
+        let offset = 15;
+        let width = window.innerWidth > 0 ? window.innerWidth : screen.width;
+        if (width <= 360) {
+          allToasts[i].style[classUsed] = `${offsetSize[classUsed]}px`;
+          offsetSize[classUsed] += height + offset;
+        } else {
+          if (allToasts[i].classList.contains("toastify-left") === true) {
+            allToasts[i].style[classUsed] = `${topLeftOffsetSize[classUsed]}px`;
+            topLeftOffsetSize[classUsed] += height + offset;
+          } else {
+            allToasts[i].style[classUsed] = `${topRightOffsetSize[classUsed]}px`;
+            topRightOffsetSize[classUsed] += height + offset;
+          }
+        }
+      }
+    }
+    _getAxisOffsetAValue(axis, options) {
+      if (options.offset[axis]) {
+        if (isNaN(options.offset[axis])) {
+          return options.offset[axis];
+        } else {
+          return `${options.offset[axis]}px`;
+        }
+      }
+      return "0px";
+    }
+  }
+  function StartToastifyInstance(options) {
+    return new Toastify(options);
+  }
+  CableReady.operations.stimulusReflexVersionMismatch = operation => {
+    const levels = {
+      info: {},
+      success: {
+        background: "#198754",
+        color: "white"
+      },
+      warn: {
+        background: "#ffc107",
+        color: "black"
+      },
+      error: {
+        background: "#dc3545",
+        color: "white"
+      }
+    };
+    const defaults = {
+      selector: setupToastify(),
+      close: true,
+      duration: 30 * 1e3,
+      gravity: "bottom",
+      position: "right",
+      newWindow: true,
+      style: levels[operation.level || "info"]
+    };
+    StartToastifyInstance({
+      ...defaults,
+      ...operation
+    }).showToast();
+  };
+  function setupToastify() {
+    const id = "stimulus-reflex-toast-element";
+    let element = document.querySelector(`#${id}`);
+    if (!element) {
+      element = document.createElement("div");
+      element.id = id;
+      document.documentElement.appendChild(element);
+      const styles = document.createElement("style");
+      styles.innerHTML = `\n      #${id} .toastify {\n         padding: 12px 20px;\n         color: #ffffff;\n         display: inline-block;\n         background: -webkit-linear-gradient(315deg, #73a5ff, #5477f5);\n         background: linear-gradient(135deg, #73a5ff, #5477f5);\n         position: fixed;\n         opacity: 0;\n         transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);\n         border-radius: 2px;\n         cursor: pointer;\n         text-decoration: none;\n         max-width: calc(50% - 20px);\n         z-index: 2147483647;\n         bottom: -150px;\n         right: 15px;\n      }\n\n      #${id} .toastify.on {\n        opacity: 1;\n      }\n\n      #${id} .toast-close {\n        background: transparent;\n        border: 0;\n        color: white;\n        cursor: pointer;\n        font-family: inherit;\n        font-size: 1em;\n        opacity: 0.4;\n        padding: 0 5px;\n      }\n    `;
+      document.head.appendChild(styles);
+    }
+    return element;
+  }
   let deprecationWarnings = true;
   var Deprecate = {
     get enabled() {
@@ -149,6 +425,7 @@
     }
     return list;
   };
+  const reflexNameToControllerIdentifier = reflexName => reflexName.replace(/([a-z0–9])([A-Z])/g, "$1-$2").replace(/(::)/g, "--").replace(/-reflex$/gi, "").toLowerCase();
   const stages = [ "created", "before", "delivered", "queued", "after", "finalized", "success", "error", "halted", "forbidden" ];
   let lastReflex;
   const reflexes = new Proxy({}, {
@@ -585,7 +862,7 @@
     return attrs;
   };
   var name = "stimulus_reflex";
-  var version = "3.5.0-pre10";
+  var version = "3.5.0-rc1";
   var description = "Build reactive applications with the Rails tooling you already know and love.";
   var keywords = [ "ruby", "rails", "websockets", "actioncable", "turbolinks", "reactive", "cable", "ujs", "ssr", "stimulus", "reflex", "stimulus_reflex", "dom", "morphdom" ];
   var homepage = "https://docs.stimulusreflex.com";
@@ -607,17 +884,18 @@
     "build:watch": "yarn rollup -wc",
     watch: "yarn build:watch",
     test: "web-test-runner javascript/test/**/*.test.js",
+    "test:watch": "yarn test --watch",
     "docs:dev": "vitepress dev docs",
-    "docs:build": "vitepress build docs",
+    "docs:build": "vitepress build docs && cp docs/_redirects docs/.vitepress/dist",
     "docs:preview": "vitepress preview docs"
   };
   var peerDependencies = {
     "@hotwired/stimulus": ">= 3.0"
   };
   var dependencies = {
-    "@hotwired/stimulus": ">= 3.0, < 4",
-    "@rails/actioncable": ">= 6.0, < 8",
-    cable_ready: "5.0.0-pre10"
+    "@hotwired/stimulus": "^3",
+    "@rails/actioncable": "^6 || ^7",
+    cable_ready: "5.0.0-rc1"
   };
   var devDependencies = {
     "@open-wc/testing": "^3.1.7",
@@ -626,10 +904,11 @@
     "@rollup/plugin-terser": "^0.4.0",
     "@web/dev-server-esbuild": "^0.3.3",
     "@web/dev-server-rollup": "^0.3.21",
-    "@web/test-runner": "^0.15.0",
+    "@web/test-runner": "^0.15.1",
     "prettier-standard": "^16.4.1",
-    rollup: "^3.17.1",
-    vitepress: "^1.0.0-alpha.47"
+    rollup: "^3.19.1",
+    "toastify-js": "^1.12.0",
+    vitepress: "^1.0.0-alpha.56"
   };
   var packageInfo = {
     name: name,
@@ -847,11 +1126,11 @@
       toString: () => reflex.error
     })));
   };
-  const localReflexControllers = element => attributeValues(element.getAttribute(Schema.controller)).reduce(((memo, name) => {
-    const controller = App.app.getControllerForElementAndIdentifier(element, name);
-    if (controller && controller.StimulusReflex) memo.push(controller);
-    return memo;
-  }), []);
+  const localReflexControllers = element => {
+    const potentialIdentifiers = attributeValues(element.getAttribute(Schema.controller));
+    const potentialControllers = potentialIdentifiers.map((identifier => App.app.getControllerForElementAndIdentifier(element, identifier)));
+    return potentialControllers.filter((controller => controller && controller.StimulusReflex));
+  };
   const allReflexControllers = element => {
     let controllers = [];
     while (element) {
@@ -862,8 +1141,9 @@
   };
   const findControllerByReflexName = (reflexName, controllers) => {
     const controller = controllers.find((controller => {
-      if (!controller.identifier) return;
-      return extractReflexName(reflexName).replace(/([a-z0–9])([A-Z])/g, "$1-$2").replace(/(::)/g, "--").toLowerCase() === controller.identifier;
+      if (!controller || !controller.identifier) return;
+      const identifier = reflexNameToControllerIdentifier(extractReflexName(reflexName));
+      return identifier === controller.identifier;
     }));
     return controller || controllers[0];
   };
@@ -871,18 +1151,22 @@
     const reflexElements = document.querySelectorAll(`[${Schema.reflex}]`);
     reflexElements.forEach((element => scanForReflexesOnElement(element)));
   }), 20);
-  const scanForReflexesOnElement = element => {
+  const scanForReflexesOnElement = (element, controller = null) => {
     const controllerAttribute = element.getAttribute(Schema.controller);
-    const controllers = attributeValues(controllerAttribute);
+    const controllers = attributeValues(controllerAttribute).filter((controller => controller !== "stimulus-reflex"));
     const reflexAttribute = element.getAttribute(Schema.reflex);
     const reflexAttributeNames = attributeValues(reflexAttribute);
     const actionAttribute = element.getAttribute(Schema.action);
     const actions = attributeValues(actionAttribute).filter((action => !action.includes("#__perform")));
     reflexAttributeNames.forEach((reflexName => {
-      const controller = findControllerByReflexName(reflexName, allReflexControllers(element));
+      const potentialControllers = [ controller ].concat(allReflexControllers(element));
+      controller = findControllerByReflexName(reflexName, potentialControllers);
       const controllerName = controller ? controller.identifier : "stimulus-reflex";
       actions.push(`${reflexName.split("->")[0]}->${controllerName}#__perform`);
-      controllers.push(controllerName);
+      const parentControllerElement = element.closest(`[data-controller~=${controllerName}]`);
+      if (!parentControllerElement) {
+        controllers.push(controllerName);
+      }
     }));
     const controllerValue = attributeValue(controllers);
     const actionValue = attributeValue(actions);
@@ -1005,7 +1289,7 @@
         });
       }
     });
-    scanForReflexesOnElement(controller.element);
+    scanForReflexesOnElement(controller.element, controller);
     emitEvent("stimulus-reflex:controller-registered", {
       detail: {
         controller: controller

data/app/channels/stimulus_reflex/channel.rb

@@ -27,24 +27,7 @@ class StimulusReflex::Channel < StimulusReflex.configuration.parent_channel.cons
           reflex.logger&.error error_message
           reflex.broadcast_error data: data, error: "#{exception} #{exception.backtrace.first.split(":in ")[0] if Rails.env.development?}"
         else
-          if exception.is_a? StimulusReflex::Reflex::VersionMismatchError
-            mismatch = "Reflex failed due to stimulus_reflex gem/NPM package version mismatch. Package versions must match exactly.\nNote that if you are using pre-release builds, gems use the \"x.y.z.preN\" version format, while NPM packages use \"x.y.z-preN\".\n\nstimulus_reflex gem: #{StimulusReflex::VERSION}\nstimulus_reflex NPM: #{data["version"]}"
-
-            StimulusReflex.config.logger.error("\n\e[31m#{mismatch}\e[0m") unless StimulusReflex.config.on_failed_sanity_checks == :ignore
-
-            if Rails.env.development?
-              CableReady::Channels.instance[stream_name].console_log(
-                message: mismatch,
-                level: "error",
-                id: data["id"]
-              ).broadcast
-            end
-
-            if StimulusReflex.config.on_failed_sanity_checks == :exit
-              sleep 0.1
-              exit!
-            end
-          else
+          unless exception.is_a?(StimulusReflex::Reflex::VersionMismatchError)
             StimulusReflex.config.logger.error error_message
           end
 

data/lib/generators/stimulus_reflex/stimulus_reflex_generator.rb

@@ -34,20 +34,20 @@ class StimulusReflexGenerator < Rails::Generators::NamedBase
     end
 
     reflex_entrypoint = Rails.env.test? ? "tmp/app/reflexes" : "app/reflexes"
-    reflex_src = fetch("/app/reflexes/%file_name%_reflex.rb.tt")
+    reflex_src = "app/reflexes/%file_name%_reflex.rb.tt"
     reflex_path = Rails.root.join(reflex_entrypoint, "#{file_name}_reflex.rb")
-    stimulus_controller_src = fetch("/app/javascript/controllers/%file_name%_controller.js.tt")
+    stimulus_controller_src = "app/javascript/controllers/%file_name%_controller.js.tt"
     stimulus_controller_path = Rails.root.join(entrypoint, "controllers/#{file_name}_controller.js")
 
     template(reflex_src, reflex_path) unless options[:skip_reflex]
     template(stimulus_controller_src, stimulus_controller_path) unless options[:skip_stimulus]
 
     if file_name == "example"
-      controller_src = fetch("/app/controllers/examples_controller.rb.tt")
+      controller_src = "app/controllers/examples_controller.rb.tt"
       controller_path = Rails.root.join("app/controllers/examples_controller.rb")
       template(controller_src, controller_path)
 
-      view_src = fetch("/app/views/examples/show.html.erb.tt")
+      view_src = "app/views/examples/show.html.erb.tt"
       view_path = Rails.root.join("app/views/examples/show.html.erb")
       template(view_src, view_path)
 
@@ -83,10 +83,4 @@ class StimulusReflexGenerator < Rails::Generators::NamedBase
       end
     end
   end
-
-  private
-
-  def fetch(file)
-    source_paths.first + file
-  end
 end

data/lib/generators/stimulus_reflex/templates/app/reflexes/%file_name%_reflex.rb.tt

@@ -66,7 +66,7 @@ class <%= class_name %>Reflex < ApplicationReflex
   <%- actions.each do |action| -%>
   def <%= action %>
   end
-  <%= "\n" unless action == actions.last -%>
+<%= "\n" unless action == actions.last -%>
   <%- end -%>
 <%- end -%>
 end

data/lib/generators/stimulus_reflex/templates/app/reflexes/application_reflex.rb.tt

@@ -8,7 +8,7 @@ class ApplicationReflex < StimulusReflex::Reflex
   # If your ActionCable connection is: `identified_by :current_user`
   #   delegate :current_user, to: :connection
   #
-  # current_user delegation alloqs you to use the Current pattern, too:
+  # current_user delegation allows you to use the Current pattern, too:
   #   before_reflex do
   #     Current.user = current_user
   #   end

data/lib/generators/stimulus_reflex/templates/config/initializers/cable_ready.rb

@@ -19,4 +19,9 @@ CableReady.configure do |config|
   # Change the default Active Job queue used for broadcast_later and broadcast_later_to
   #
   # config.broadcast_job_queue = :default
+
+  # Specify a default debounce time for CableReady::Updatable callbacks
+  # Doing so is a best practice to avoid heavy ActionCable traffic
+  #
+  # config.updatable_debounce_time = 0.1.seconds
 end

data/lib/install/development.rb

@@ -36,13 +36,13 @@ lines = development_working_path.readlines
 
 if (index = lines.index { |line| line =~ /^[^#]*config.session_store/ })
   if /^[^#]*cookie_store/.match?(lines[index])
-    write_redis_recommendation(development_working_path, lines, index, gemfile_path)
+    write_redis_recommendation(development_working_path, lines, index, gemfile)
     halt "StimulusReflex does not support session cookies. See https://docs.stimulusreflex.com/hello-world/setup#session-storage"
     return
   elsif /^[^#]*redis_session_store/.match?(lines[index])
     say "⏩ Already using redis-session-store for session storage. Skipping."
   else
-    write_redis_recommendation(development_working_path, lines, index, gemfile_path)
+    write_redis_recommendation(development_working_path, lines, index, gemfile)
     say "🤷 We recommend using redis-session-store for session storage. See https://docs.stimulusreflex.com/hello-world/setup#session-storage"
   end
 # no session store defined, so let's opt-in to redis-session-store

data/lib/install/importmap.rb

@@ -50,7 +50,7 @@ backup(importmap_path) do
 
   if !importmap.include?("pin \"@hotwired/stimulus\"")
     append_file(importmap_path, <<~RUBY, verbose: false)
-      pin "@hotwired/stimulus", to: "stimulus.min.js", preload: true
+      pin "@hotwired/stimulus", to: "stimulus.js", preload: true
     RUBY
     say "✅ pin @hotwired/stimulus"
   else
@@ -68,7 +68,7 @@ backup(importmap_path) do
 
   if !importmap.include?("pin \"cable_ready\"")
     append_file(importmap_path, <<~RUBY, verbose: false)
-      pin "cable_ready", to: "cable_ready.min.js", preload: true
+      pin "cable_ready", to: "cable_ready.js", preload: true
     RUBY
     say "✅ pin cable_ready"
   else
@@ -77,7 +77,7 @@ backup(importmap_path) do
 
   if !importmap.include?("pin \"stimulus_reflex\"")
     append_file(importmap_path, <<~RUBY, verbose: false)
-      pin "stimulus_reflex", to: "stimulus_reflex.min.js", preload: true
+      pin "stimulus_reflex", to: "stimulus_reflex.js", preload: true
     RUBY
     say "✅ pin stimulus_reflex"
   else

data/lib/stimulus_reflex/cable_ready_channels.rb

@@ -7,6 +7,7 @@ module StimulusReflex
     def initialize(reflex)
       @stream_name = reflex.stream_name
       @id = reflex.id
+      CableReady.config.add_operation_name(:stimulus_reflex_version_mismatch)
     end
 
     def cable_ready_channels

data/lib/stimulus_reflex/engine.rb

@@ -17,11 +17,7 @@ module StimulusReflex
     #
     PRECOMPILE_ASSETS = %w[
       stimulus_reflex.js
-      stimulus_reflex.min.js
-      stimulus_reflex.min.js.map
       stimulus_reflex.umd.js
-      stimulus_reflex.umd.min.js
-      stimulus_reflex.umd.min.js.map
     ]
 
     initializer "stimulus_reflex.assets" do |app|

data/lib/stimulus_reflex/importmap.rb

@@ -1,7 +1,7 @@
 # frozen_string_literal: true
 
 pin "@rails/actioncable", to: "actioncable.esm.js", preload: true
-pin "@hotwired/stimulus", to: "stimulus.min.js", preload: true
+pin "@hotwired/stimulus", to: "stimulus.js", preload: true
 pin "morphdom", to: "https://ga.jspm.io/npm:morphdom@2.6.1/dist/morphdom.js", preload: true
-pin "cable_ready", to: "cable_ready.min.js", preload: true
-pin "stimulus_reflex", to: "stimulus_reflex.min.js", preload: true
+pin "cable_ready", to: "cable_ready.js", preload: true
+pin "stimulus_reflex", to: "stimulus_reflex.js", preload: true

data/lib/stimulus_reflex/reflex.rb

@@ -1,16 +1,27 @@
 # frozen_string_literal: true
 
 require "stimulus_reflex/cable_readiness"
+require "stimulus_reflex/version_checker"
 
 # TODO remove xpath_controller and xpath_element for v4
-ClientAttributes = Struct.new(:id, :tab_id, :reflex_controller, :xpath_controller, :xpath_element, :permanent_attribute_name, :version, :suppress_logging, keyword_init: true)
+ClientAttributes = Struct.new(
+  :id,
+  :tab_id,
+  :reflex_controller,
+  :xpath_controller,
+  :xpath_element,
+  :permanent_attribute_name,
+  :version,
+  :npm_version,
+  :suppress_logging,
+  keyword_init: true
+)
 
 class StimulusReflex::Reflex
-  class VersionMismatchError < StandardError; end
-
   prepend StimulusReflex::CableReadiness
-  include ActiveSupport::Rescuable
+  include StimulusReflex::VersionChecker
   include StimulusReflex::Callbacks
+  include ActiveSupport::Rescuable
   include ActionView::Helpers::TagHelper
   include CableReady::Identifiable
 
@@ -23,7 +34,7 @@ class StimulusReflex::Reflex
   delegate :controller_class, :flash, :session, to: :request
   delegate :broadcast, :broadcast_halt, :broadcast_forbid, :broadcast_error, to: :broadcaster
   # TODO remove xpath_controller and xpath_element for v4
-  delegate :id, :tab_id, :reflex_controller, :xpath_controller, :xpath_element, :permanent_attribute_name, :version, :suppress_logging, to: :client_attributes
+  delegate :id, :tab_id, :reflex_controller, :xpath_controller, :xpath_element, :permanent_attribute_name, :version, :npm_version, :suppress_logging, to: :client_attributes
 
   def initialize(channel, url: nil, element: nil, selectors: [], method_name: nil, params: {}, client_attributes: {})
     @channel = channel
@@ -38,9 +49,7 @@ class StimulusReflex::Reflex
     @payload = {}
     @headers = {}
 
-    if version != StimulusReflex::VERSION && StimulusReflex.config.on_failed_sanity_checks != :ignore
-      raise VersionMismatchError.new("stimulus_reflex gem / NPM package version mismatch")
-    end
+    check_version!
 
     self.params
   end

data/lib/stimulus_reflex/reflex_data.rb

@@ -52,7 +52,7 @@ class StimulusReflex::ReflexData
   end
 
   def params
-    form_params.merge(url_params)
+    form_params.deep_merge(url_params)
   end
 
   def form_params
@@ -85,6 +85,10 @@ class StimulusReflex::ReflexData
     data["reflexController"]
   end
 
+  def npm_version
+    data["version"].to_s
+  end
+
   def version
     data["version"].to_s.gsub("-pre", ".pre")
   end

data/lib/stimulus_reflex/reflex_factory.rb

@@ -20,7 +20,8 @@ class StimulusReflex::ReflexFactory
           reflex_controller: reflex_data.reflex_controller,
           permanent_attribute_name: reflex_data.permanent_attribute_name,
           suppress_logging: reflex_data.suppress_logging,
-          version: reflex_data.version
+          version: reflex_data.version,
+          npm_version: reflex_data.npm_version
         })
     end
 

data/lib/stimulus_reflex/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module StimulusReflex
-  VERSION = "3.5.0.pre10"
+  VERSION = "3.5.0.rc1"
 end