stimulus_reflex 2.0.0 → 2.0.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 8072c82ab1f16ce62c41e6d970952c3762a9e2fe5d87d2036ff2f37af7f3a4fb
-  data.tar.gz: b3549d33023d9c27e878443f48391e13b82562e4dc9d9cbfb64b9744d8fe0702
+  metadata.gz: eb76c0066092e1f7ee8db5642f38b41c2c7f0e6718ab87c6a3358833fbe9b685
+  data.tar.gz: 79bb331fcce6f043d1098e41bf0a373c277138fadb0963784f58825fe5786309
 SHA512:
-  metadata.gz: 5ba2646379f9bbe65485d947c55467640e890d516ad571f704e064f0fb78956b977ba405d5698efdb6fd3b7e87f1075a9948d59c4b6ec2855410d3b290137a31
-  data.tar.gz: 756a22a1a4cb5f1d4ad985dd1424ed15edc3d2e4d8efcf080d3c3a9a551a170fc1a76d84543fd105acc104b97c07d7f377348a00ec329222fa6341c0e627051c
+  metadata.gz: c55bc084dbf1e05f799a0a17e1d94a11951d79574a1b89492fabfa8c884d4e1e44aa1f9d9223462f043b5ca8f23a7a0f068939d9a0ac1aff53959d07fa0dbddd
+  data.tar.gz: 360e7909ab6bf950c426e18de0ed857f65b1fb5c51ce77cf19f8644420f6cd798b79f803f8cf7485c02d6f77c245c88f7326846d37d787d0728e68c8b1e0eb13

data/CODE_OF_CONDUCT.md

@@ -0,0 +1,76 @@
+# Contributor Covenant Code of Conduct
+
+## Our Pledge
+
+In the interest of fostering an open and welcoming environment, we as
+contributors and maintainers pledge to making participation in our project and
+our community a harassment-free experience for everyone, regardless of age, body
+size, disability, ethnicity, sex characteristics, gender identity and expression,
+level of experience, education, socio-economic status, nationality, personal
+appearance, race, religion, or sexual identity and orientation.
+
+## Our Standards
+
+Examples of behavior that contributes to creating a positive environment
+include:
+
+- Using welcoming and inclusive language
+- Being respectful of differing viewpoints and experiences
+- Gracefully accepting constructive criticism
+- Focusing on what is best for the community
+- Showing empathy towards other community members
+
+Examples of unacceptable behavior by participants include:
+
+- The use of sexualized language or imagery and unwelcome sexual attention or
+  advances
+- Trolling, insulting/derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or electronic
+  address, without explicit permission
+- Other conduct which could reasonably be considered inappropriate in a
+  professional setting
+
+## Our Responsibilities
+
+Project maintainers are responsible for clarifying the standards of acceptable
+behavior and are expected to take appropriate and fair corrective action in
+response to any instances of unacceptable behavior.
+
+Project maintainers have the right and responsibility to remove, edit, or
+reject comments, commits, code, wiki edits, issues, and other contributions
+that are not aligned to this Code of Conduct, or to ban temporarily or
+permanently any contributor for other behaviors that they deem inappropriate,
+threatening, offensive, or harmful.
+
+## Scope
+
+This Code of Conduct applies both within project spaces and in public spaces
+when an individual is representing the project or its community. Examples of
+representing a project or community include using an official project e-mail
+address, posting via an official social media account, or acting as an appointed
+representative at an online or offline event. Representation of a project may be
+further defined and clarified by project maintainers.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported by contacting the project team at natehop@gmail.com. All
+complaints will be reviewed and investigated and will result in a response that
+is deemed necessary and appropriate to the circumstances. The project team is
+obligated to maintain confidentiality with regard to the reporter of an incident.
+Further details of specific enforcement policies may be posted separately.
+
+Project maintainers who do not follow or enforce the Code of Conduct in good
+faith may face temporary or permanent repercussions as determined by other
+members of the project's leadership.
+
+## Attribution
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
+available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html
+
+[homepage]: https://www.contributor-covenant.org
+
+For answers to common questions about this code of conduct, see
+https://www.contributor-covenant.org/faq

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    stimulus_reflex (2.0.0)
+    stimulus_reflex (2.0.1)
       cable_ready (>= 4.0.3)
       nokogiri
       rack
@@ -67,12 +67,12 @@ GEM
       zeitwerk (~> 2.1, >= 2.1.8)
     ast (2.4.0)
     builder (3.2.3)
-    cable_ready (4.0.3)
+    cable_ready (4.0.5)
       rails (>= 5.2)
     coderay (1.1.2)
     concurrent-ruby (1.1.5)
     crass (1.0.4)
-    erubi (1.8.0)
+    erubi (1.9.0)
     globalid (0.4.2)
       activesupport (>= 4.2.0)
     i18n (1.6.0)
@@ -89,12 +89,12 @@ GEM
     mimemagic (0.3.3)
     mini_mime (1.0.2)
     mini_portile2 (2.4.0)
-    minitest (5.11.3)
-    nio4r (2.5.1)
+    minitest (5.12.0)
+    nio4r (2.5.2)
     nokogiri (1.10.4)
       mini_portile2 (~> 2.4.0)
     parallel (1.17.0)
-    parser (2.6.4.0)
+    parser (2.6.4.1)
       ast (~> 2.4.0)
     pry (0.12.2)
       coderay (~> 1.1.0)
@@ -149,7 +149,7 @@ GEM
       actionpack (>= 4.0)
       activesupport (>= 4.0)
       sprockets (>= 3.0.0)
-    standard (0.1.3)
+    standard (0.1.4)
       rubocop (~> 0.72.0)
       rubocop-performance (~> 1.4.0)
     standardrb (1.0.0)

data/README.md

@@ -1,132 +1,95 @@
-[![Lines of Code](http://img.shields.io/badge/lines_of_code-218-brightgreen.svg?style=flat)](http://blog.codinghorror.com/the-best-code-is-no-code-at-all/)
-[![Maintainability](https://api.codeclimate.com/v1/badges/2b24fdbd1ae37a24bedb/maintainability)](https://codeclimate.com/github/hopsoft/stimulus_reflex/maintainability)
-![Prettier](https://github.com/hopsoft/stimulus_reflex/workflows/Prettier%20Check%20Action/badge.svg)
-![StandardRB](https://github.com/hopsoft/stimulus_reflex/workflows/StandardRB%20Check%20Action/badge.svg)
+---
+description: Ensure your projects are fast to market... with a small team
+---
 
 # StimulusReflex
 
-_reflex_ - an action that is performed as a response to a stimulus
-
-### Build reactive [Single Page Applications (SPAs)](https://en.wikipedia.org/wiki/Single-page_application) with [Rails](https://rubyonrails.org) and [Stimulus](https://stimulusjs.org)
-
-This project supports building [reactive applications](https://en.wikipedia.org/wiki/Reactive_programming)
-with the Rails tooling you already know and love.
-It's designed to work perfectly with [server rendered HTML](https://guides.rubyonrails.org/action_view_overview.html),
-[Russian doll caching](https://edgeguides.rubyonrails.org/caching_with_rails.html#russian-doll-caching),
-[Stimulus](https://stimulusjs.org), [Turbolinks](https://www.youtube.com/watch?v=SWEts0rlezA), etc...
-
-__No need for a complex front-end framework. No need to grow your team or duplicate your efforts.__
-
-_Inspired by [Phoenix LiveView](https://youtu.be/Z2DU0qLfPIY?t=670)._ 🙌
-
-## Table of Contents
-
-<!-- toc -->
-
-- [Before you Begin](#before-you-begin)
-- [How it Works](#how-it-works)
-- [Setup](#setup)
-  * [JavaScript](#javascript)
-    + [app/javascript/controllers/index.js](#appjavascriptcontrollersindexjs)
-  * [Gemfile](#gemfile)
-- [Usage](#usage)
-  * [Implicit Declarative Reflexes](#implicit-declarative-reflexes)
-    + [app/views/pages/example.html.erb](#appviewspagesexamplehtmlerb)
-    + [app/reflexes/example_reflex.rb](#appreflexesexample_reflexrb)
-  * [Explicitly Defined Reflexes](#explicitly-defined-reflexes)
-    + [app/views/pages/example.html.erb](#appviewspagesexamplehtmlerb-1)
-    + [app/javascript/controllers/example.js](#appjavascriptcontrollersexamplejs)
-    + [app/reflexes/example_reflex.rb](#appreflexesexample_reflexrb-1)
-- [What Just Happened](#what-just-happened)
-- [Advanced Usage](#advanced-usage)
-  * [The Reflex `element` property](#the-reflex-element-property)
-  * [ActionCable](#actioncable)
-    + [Performance](#performance)
-    + [ActionCable Rooms](#actioncable-rooms)
-  * [Render Delay](#render-delay)
-- [Demo Applications](#demo-applications)
-- [Contributing](#contributing)
-  * [Coding Standards](#coding-standards)
-  * [Releasing](#releasing)
-
-<!-- tocstop -->
+###### Read this document on the [official docs site](https://docs.stimulusreflex.com).
 
-## Before you Begin
+[![Lines of Code](http://img.shields.io/badge/lines_of_code-359-brightgreen.svg?style=flat)](http://blog.codinghorror.com/the-best-code-is-no-code-at-all/)
+[![Maintainability](https://api.codeclimate.com/v1/badges/2b24fdbd1ae37a24bedb/maintainability)](https://codeclimate.com/github/hopsoft/stimulus_reflex/maintainability)
+![Prettier](https://github.com/hopsoft/stimulus_reflex/workflows/Prettier/badge.svg)
+![StandardRB](https://github.com/hopsoft/stimulus_reflex/workflows/StandardRB/badge.svg)
 
-StimulusReflex provides functionality similar to what can already be achieved with Rails by combining
-[UJS remote elements](https://guides.rubyonrails.org/working_with_javascript_in_rails.html#remote-elements)
-, [Stimulus](https://stimulusjs.org), and [Turbolinks](https://github.com/turbolinks/turbolinks).
-_Consider building with standard Rails tooling before introducing StimulusReflex._
-_Check out the [Stimulus TodoMVC](https://github.com/hopsoft/stimulus_todomvc) example if you are unsure how to accomplish this._
+**Build reactive applications with the Rails tooling you already know and love.** StimulusReflex is designed to work perfectly with [server rendered HTML](https://guides.rubyonrails.org/action_view_overview.html), [Russian doll caching](https://edgeguides.rubyonrails.org/caching_with_rails.html#russian-doll-caching), [Stimulus](https://stimulusjs.org/), [Turbolinks](https://www.youtube.com/watch?v=SWEts0rlezA), etc... and strives to live up to the vision outlined in [The Rails Doctrine](https://rubyonrails.org/doctrine/).
 
-StimulusReflex offers 3 primary benefits over the traditional Rails HTTP request/response cycle.
+## Before you Begin
 
-1. __Communication happens on the ActionCable web socket__ _- saves time by avoiding the overhead of establishishing traditional HTTP connections_
-1. __The controller action is invoked directly__ _- skips framework overhead such as the middleware chain, etc..._
-1. __DOM diffing is used to update the page__ _- provides faster rendering and less jitter_
+A great user experience can be created with Rails alone. Tools like [UJS remote elements](https://guides.rubyonrails.org/working_with_javascript_in_rails.html#remote-elements) , [Stimulus](https://stimulusjs.org/), and [Turbolinks](https://github.com/turbolinks/turbolinks) are incredibly powerful when combined. Try building your application using these tools before introducing StimulusReflex.
 
-## How it Works
+{% hint style="info" %}
+See the [Stimulus TodoMVC](https://github.com/hopsoft/stimulus_todomvc) example application if you are unsure how to do this.
+{% endhint %}
 
-1. Render a standard Rails view template
-1. Use [Stimulus](https://stimulusjs.org) and [ActionCable](https://edgeguides.rubyonrails.org/action_cable_overview.html) to invoke a method on the server
-1. Watch the page automatically render updates via fast [DOM diffing](https://github.com/patrick-steele-idem/morphdom)
-1. That's it...
+## Benefits
 
-__Yes, it really is that simple.__
-There are no hidden gotchas.
+StimulusReflex offers 3 primary benefits over the traditional Rails request/response cycle.
 
-![How it Works](https://raw.githubusercontent.com/hopsoft/stimulus_reflex/master/docs/diagram.png)
+1. **All communication happens via web socket** - avoids the overhead of traditional HTTP connections
+2. **The controller action is invoked directly** - skips framework overhead like the middleware chain
+3. **DOM diffing is used to update the page** - provides faster rendering and less jitter
 
 ## Setup
 
-### JavaScript
-
-```
+```bash
 yarn add stimulus_reflex
 ```
-#### app/javascript/controllers/index.js
-
-This is the file where Stimulus is initialized in your application.
-_Note that your file location may be different._
 
+{% code-tabs %}
+{% code-tabs-item title="app/javascript/controllers/index.js" %}
 ```javascript
-import { Application } from 'stimulus';
-import { definitionsFromContext } from 'stimulus/webpack-helpers';
-import StimulusReflex from 'stimulus_reflex';
-
-const application = Application.start();
-const context = require.context('controllers', true, /_controller\.js$/);
-application.load(definitionsFromContext(context));
-StimulusReflex.initialize(application);
+import { Application } from 'stimulus'
+import { definitionsFromContext } from 'stimulus/webpack-helpers'
+import StimulusReflex from 'stimulus_reflex'
+
+const application = Application.start()
+const context = require.context('controllers', true, /_controller\.js$/)
+application.load(definitionsFromContext(context))
+StimulusReflex.initialize(application)
 ```
+{% endcode-tabs-item %}
+{% endcode-tabs %}
 
-### Gemfile
-
+{% code-tabs %}
+{% code-tabs-item title="Gemfile" %}
 ```ruby
 gem "stimulus_reflex"
 ```
+{% endcode-tabs-item %}
+{% endcode-tabs %}
+
+## Quick Start
 
-## Usage
+Here are a few small contrived examples to get you started.
 
-### Implicit Declarative Reflexes
+### No JavaScript
 
-This example shows how to create a reactive feature without the need to write any JavaScript
-other than initializing StimulusReflex itself _([see the setup instructions](#javascript))_. Everything else is managed entirely by HTML and Ruby.
+It's possible to build a reactive application without writing any JavaScript. This requires 2 steps.
 
-#### app/views/pages/example.html.erb
+1. Declare the appropriate data attributes in HTML.
+2. Create a server side reflex object with Ruby.
 
-```erb
+This example will automatically update the page with the latest count whenever the anchor is clicked.
+
+{% code-tabs %}
+{% code-tabs-item title="app/views/pages/example.html.erb" %}
+```text
 <head></head>
   <body>
-    <a href="#" data-reflex="click->ExampleReflex#increment" data-step="1" data-count="<%= @count.to_i %>">
+    <a href="#"
+       data-reflex="click->ExampleReflex#increment"
+       data-step="1"
+       data-count="<%= @count.to_i %>">
       Increment <%= @count.to_i %>
     </a>
   </body>
 </html>
 ```
+{% endcode-tabs-item %}
+{% endcode-tabs %}
 
-#### app/reflexes/example_reflex.rb
-
+{% code-tabs %}
+{% code-tabs-item title="app/reflexes/example\_reflex.rb" %}
 ```ruby
 class ExampleReflex < StimulusReflex::Reflex
   def increment
@@ -134,35 +97,46 @@ class ExampleReflex < StimulusReflex::Reflex
   end
 end
 ```
+{% endcode-tabs-item %}
+{% endcode-tabs %}
+
+{% hint style="success" %}
+**Concerns like managing state and template rendering are handled server side.** This technique works regardless of how complex the UI becomes. For example, we could render multiple instances of `@count` in unrelated sections of the page and they will all update.
+{% endhint %}
 
-The code above will automatically update the relevant DOM nodes with the updated count whenever the anchor is clicked.
+{% hint style="danger" %}
+Do not create server side reflex methods named `reflex` as this is a reserved word.
+{% endhint %}
 
-__Note that all concerns from managing state to rendering views are handled server side.__
-This technique works regardless of how complex the UI may become.
-For example, we could render multiple instances of `@count` in unrelated sections of the page and they will all update.
+### Some JavaScript
 
-### Explicitly Defined Reflexes
+Real world applications typically warrant setting up finer grained control. This requires 3 steps.
 
-This example shows how to create a reactive feature by defining an explicit client side
-Stimulus controller to handle the DOM event and trigger the server side reflex.
+1. Declare the appropriate data attributes in HTML.
+2. Create a client side StimulusReflex controller with JavaScript.
+3. Create a server side reflex object with Ruby.
 
-#### app/views/pages/example.html.erb
+This example will automatically update the page with the latest count whenever the anchor is clicked.
 
-```erb
+{% code-tabs %}
+{% code-tabs-item title="app/views/pages/example.html.erb" %}
+```text
 <head></head>
   <body>
-    <a href="#" data-controller="example" data-action="click->example#increment">
+    <a href="#"
+       data-controller="example"
+       data-action="click->example#increment">
       Increment <%= @count.to_i %>
     </a>
   </body>
 </html>
 ```
-
-#### app/javascript/controllers/example.js
+{% endcode-tabs-item %}
+{% endcode-tabs %}
 
 ```javascript
-import { Controller } from "stimulus"
-import StimulusReflex from "stimulus_reflex"
+import { Controller } from 'stimulus';
+import StimulusReflex from 'stimulus_reflex';
 
 export default class extends Controller {
   connect() {
@@ -171,135 +145,47 @@ export default class extends Controller {
 
   increment() {
     // trigger a server-side reflex and a client-side page update
+    // pass the step argument with a value of `1` to the reflex method
     this.stimulate('ExampleReflex#increment', 1);
   }
 }
 ```
 
-#### app/reflexes/example_reflex.rb
-
+{% code-tabs %}
+{% code-tabs-item title="app/reflexes/example\_reflex.rb" %}
 ```ruby
 class ExampleReflex < StimulusReflex::Reflex
   def increment(step = 1)
-    @count = @count.to_i + step
+    # In a typical Rails app the Rails controller would set the value of @count
+    # after fetching it from a persistent data store
+    # @count = @count.to_i + step
+
+    # To keep this example simple, we use session to store the value
+    session[:count] = session[:count].to_i + step
+    @count = session[:count]
   end
 end
 ```
+{% endcode-tabs-item %}
+{% endcode-tabs %}
 
-## What Just Happened
+## How it Works
 
-The following happens when a `StimulusReflex::Reflex` is invoked.
+Here's what happens whenever a `StimulusReflex::Reflex` is invoked.
 
-1. The page that triggered the reflex is re-rerendered. _Instance variables created in the reflex are available to both the controller and view templates._
+1. The page that triggered the reflex is re-rerendered.
 2. The re-rendered HTML is sent to the client over the ActionCable socket.
 3. The page is updated via fast DOM diffing courtesy of morphdom.
 
-   _NOTE: While future versions of StimulusReflex may support more granular updates, today the entire body is re-rendered and sent over the socket._
-
-## Advanced Usage
-
-### The Reflex `element` property
-
-All reflex methods expose an `element` property.
-This property holds a Hash like data structure that represents the HTML element that triggered the refelx.
-It contains all of the Stimulus controller's
-[DOM element attributes](https://developer.mozilla.org/en-US/docs/Web/API/Element/attributes) as well as other properties like `checked` and `value`.
-_Most of the values will be strings._
-
-```html
-<checkbox id="example"
-          label="Example"
-          data-controller="checkbox"
-          data-value="123"
-          checked />
-```
-
-```ruby
-class ExampleReflex < StimulusReflex::Reflex
-  def work()
-    element[:id]    # => the HTML element's id attribute value
-    element.dataset # => a Hash that represents the HTML element's dataset
-
-    element[:id]                 # => "example"
-    element[:checked]            # => true
-    element[:label]              # => "Example"
-    element["data-controller"]   # => "checkbox"
-    element["data-value"]        # => "123"
-    element.dataset[:controller] # => "checkbox"
-    element.dataset[:value]      # => "123"
-  end
-end
-```
-
-- `element[:checked]` holds a boolean
-- `element[:selected]` holds a boolean
-- `element[:value]` holds the [DOM element's value](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value)
-- `select` elements assign `element[:value]` to their selected option's value
-- `select` elements with _multiselect_ enabled assign `element[:values]` to their selected options values
-- All other values exposed in `element` are extracted from the DOM element's attributes
-
-### ActionCable
-
-StimulusReflex will use the ActionCable defaults of `window.App` and `App.cable` if they exist.
-If these defaults do not exist, StimulusReflex will establish a new socket connection.
-
-#### Performance
-
-ActionCable emits verbose log messages. Disabling ActionCable logs may improve performance.
-
-```ruby
-# config/application.rb
-
-ActionCable.server.config.logger = Logger.new(nil)
-```
-
-#### ActionCable Rooms
-
-You may find the need to restrict notifications to a specific room.
-This can be accomplished by setting the `data-room` attribute on the StimulusController element.
-
-```erb
-<a href="#" data-controller="example" data-action="click->example#increment" data-room="12345">
-```
-
-### Render Delay
-
-An attempt is made to reduce repaint/reflow jitter when users trigger lots of updates.
-
-You can control how long to wait _(think debounce)_ prior to updating the page.
-Simply set the `renderDelay` _(milliseconds)_ option when registering the controller.
-
-```javascript
-export default class extends Controller {
-  connect() {
-    StimulusReflex.register(this, {renderDelay: 200});
-  }
-}
-```
-
-The default value is `25`.
-
-## Demo Applications
-
-Building apps with StimulusReflex should evoke your memories of the original [Rails demo video](https://www.youtube.com/watch?v=Gzj723LkRJY).
-
-> Look at all the things I'm **not** doing. -DHH
-
-- [TodoMVC](https://github.com/hopsoft/stimulus_reflex_todomvc)
-
-## Contributing
+{% hint style="success" %}
+All instance variables created in the reflex are made available to the Rails controller and view.
+{% endhint %}
 
-### Coding Standards
+{% hint style="info" %}
+**The entire body is re-rendered and sent over the socket.** Smaller scoped DOM updates may come in a future release.
+{% endhint %}
 
-This project uses [Standard](https://github.com/testdouble/standard)
-and [Prettier](https://github.com/prettier/prettier) to minimize bike shedding related to code formatting.
-Please run `./bin/standardize` prior submitting pull requests.
+## Example Applications
 
-### Releasing
+* [TodoMVC](https://stimulus-reflex-todomvc.herokuapp.com) - An implementation of [TodoMVC](http://todomvc.com/) using [Ruby on Rails](https://rubyonrails.org/), [StimulusJS](https://stimulusjs.org/), and [StimulusReflex](https://github.com/hopsoft/stimulus_reflex). [https://github.com/hopsoft/stimulus\_reflex\_todomvc](https://github.com/hopsoft/stimulus_reflex_todomvc)
 
-1. Bump version number at `lib/stimulus_reflex/version.rb`
-1. Run `rake build`
-1. Run `rake release`
-1. Change directories `cd ./javascript`
-1. Run `yarn publish --tag GIT_TAG_CREATED_BY_RUBYGEMS`
-1. Assign same version number to the JavaScript package _Might not be required?_

data/README.md.orig

@@ -1,74 +1,144 @@
-[![Lines of Code](http://img.shields.io/badge/lines_of_code-159-brightgreen.svg?style=flat)](http://blog.codinghorror.com/the-best-code-is-no-code-at-all/)
+<<<<<<< HEAD
+[![Lines of Code](http://img.shields.io/badge/lines_of_code-359-brightgreen.svg?style=flat)](http://blog.codinghorror.com/the-best-code-is-no-code-at-all/)
 [![Maintainability](https://api.codeclimate.com/v1/badges/2b24fdbd1ae37a24bedb/maintainability)](https://codeclimate.com/github/hopsoft/stimulus_reflex/maintainability)
+![Prettier](https://github.com/hopsoft/stimulus_reflex/workflows/Prettier/badge.svg)
+![StandardRB](https://github.com/hopsoft/stimulus_reflex/workflows/StandardRB/badge.svg)
+=======
+---
+description: Ensure your projects are fast to market... with a small team
+---
+>>>>>>> master
 
 # StimulusReflex
 
-### Build reactive [Single Page Applications (SPAs)](https://en.wikipedia.org/wiki/Single-page_application) with [Rails](https://rubyonrails.org) and [Stimulus](https://stimulusjs.org)
-
-This project supports building [reactive applications](https://en.wikipedia.org/wiki/Reactive_programming)
-with the Rails tooling you already know and love.
-It's designed to work perfectly with [server rendered HTML](https://guides.rubyonrails.org/action_view_overview.html),
-[Russian doll caching](https://edgeguides.rubyonrails.org/caching_with_rails.html#russian-doll-caching),
-[Stimulus](https://stimulusjs.org), [Turbolinks](https://www.youtube.com/watch?v=SWEts0rlezA), etc...
-
-
-__No need for a complex front-end framework. No need to grow your team or duplicate your efforts.__
-
----
+###### Read this document on the [official docs site](https://docs.stimulusreflex.com).
 
-> The lifecycle of a "modern" SPA app is so convoluted, it requires a team to build and support.
-> The wire size and computation demands of these heavy client sites frequently run slower than the server-rendered pages that they replaced.
-> With Stimulus Reflex, a Rails developer can build Single Page Applications without the need for client rendering or heavy JS frameworks.
+**Build reactive applications with the Rails tooling you already know and love.** StimulusReflex is designed to work perfectly with [server rendered HTML](https://guides.rubyonrails.org/action_view_overview.html), [Russian doll caching](https://edgeguides.rubyonrails.org/caching_with_rails.html#russian-doll-caching), [Stimulus](https://stimulusjs.org/), [Turbolinks](https://www.youtube.com/watch?v=SWEts0rlezA), etc... and strives to live up to the vision outlined in [The Rails Doctrine](https://rubyonrails.org/doctrine/).
 
----
+## Before you Begin
 
-_Inspired by [Phoenix LiveView](https://youtu.be/Z2DU0qLfPIY?t=670)._ 🙌
+A great user experience can be created with Rails alone. Tools like [UJS remote elements](https://guides.rubyonrails.org/working_with_javascript_in_rails.html#remote-elements) , [Stimulus](https://stimulusjs.org/), and [Turbolinks](https://github.com/turbolinks/turbolinks) are incredibly powerful when combined. Try building your application using these tools before introducing StimulusReflex.
 
-## How it Works
+{% hint style="info" %}
+See the [Stimulus TodoMVC](https://github.com/hopsoft/stimulus_todomvc) example application if you are unsure how to do this.
+{% endhint %}
 
-1. Render a standard Rails view template
-1. Use [Stimulus](https://stimulusjs.org) and [ActionCable](https://edgeguides.rubyonrails.org/action_cable_overview.html) to invoke a method on the server
-1. Watch the page automatically render updates via fast [DOM diffing](https://github.com/patrick-steele-idem/morphdom)
-1. That's it...
+## Benefits
 
-__Yes, it really is that simple.__
-There are no hidden gotchas.
+StimulusReflex offers 3 primary benefits over the traditional Rails request/response cycle.
 
-![How it Works](https://raw.githubusercontent.com/hopsoft/stimulus_reflex/master/docs/diagram.png)
+1. **All communication happens via web socket** - avoids the overhead of traditional HTTP connections
+2. **The controller action is invoked directly** - skips framework overhead like the middleware chain
+3. **DOM diffing is used to update the page** - provides faster rendering and less jitter
 
 ## Setup
 
-### JavaScript
-
-```
+```bash
 yarn add stimulus_reflex
 ```
 
-### Gemfile
+{% code-tabs %}
+{% code-tabs-item title="app/javascript/controllers/index.js" %}
+```javascript
+import { Application } from 'stimulus'
+import { definitionsFromContext } from 'stimulus/webpack-helpers'
+import StimulusReflex from 'stimulus_reflex'
+
+const application = Application.start()
+const context = require.context('controllers', true, /_controller\.js$/)
+application.load(definitionsFromContext(context))
+StimulusReflex.initialize(application)
+```
+{% endcode-tabs-item %}
+{% endcode-tabs %}
 
+{% code-tabs %}
+{% code-tabs-item title="Gemfile" %}
 ```ruby
 gem "stimulus_reflex"
 ```
+{% endcode-tabs-item %}
+{% endcode-tabs %}
+
+## Quick Start
+
+Here are a few small contrived examples to get you started.
 
-## Basic Usage
+### No JavaScript
 
-### app/views/pages/example.html.erb
+It's possible to build a reactive application without writing any JavaScript. This requires 2 steps.
 
-```erb
+1. Declare the appropriate data attributes in HTML.
+2. Create a server side reflex object with Ruby.
+
+This example will automatically update the page with the latest count whenever the anchor is clicked.
+
+{% code-tabs %}
+{% code-tabs-item title="app/views/pages/example.html.erb" %}
+```text
 <head></head>
   <body>
-    <a href="#" data-controller="example" data-action="click->example#increment">
+    <a href="#"
+       data-reflex="click->ExampleReflex#increment"
+       data-step="1"
+       data-count="<%= @count.to_i %>">
       Increment <%= @count.to_i %>
     </a>
   </body>
 </html>
 ```
+{% endcode-tabs-item %}
+{% endcode-tabs %}
+
+{% code-tabs %}
+{% code-tabs-item title="app/reflexes/example\_reflex.rb" %}
+```ruby
+class ExampleReflex < StimulusReflex::Reflex
+  def increment
+    @count = element.dataset[:count].to_i + element.dataset[:step].to_i
+  end
+end
+```
+{% endcode-tabs-item %}
+{% endcode-tabs %}
+
+{% hint style="success" %}
+**Concerns like managing state and template rendering are handled server side.** This technique works regardless of how complex the UI becomes. For example, we could render multiple instances of `@count` in unrelated sections of the page and they will all update.
+{% endhint %}
 
-### app/javascript/controllers/example.js
+{% hint style="danger" %}
+Do not create server side reflex methods named `reflex` as this is a reserved word.
+{% endhint %}
+
+### Some JavaScript
+
+Real world applications typically warrant setting up finer grained control. This requires 3 steps.
+
+1. Declare the appropriate data attributes in HTML.
+2. Create a client side StimulusReflex controller with JavaScript.
+3. Create a server side reflex object with Ruby.
+
+This example will automatically update the page with the latest count whenever the anchor is clicked.
+
+{% code-tabs %}
+{% code-tabs-item title="app/views/pages/example.html.erb" %}
+```text
+<head></head>
+  <body>
+    <a href="#"
+       data-controller="example"
+       data-action="click->example#increment">
+      Increment <%= @count.to_i %>
+    </a>
+  </body>
+</html>
+```
+{% endcode-tabs-item %}
+{% endcode-tabs %}
 
 ```javascript
-import { Controller } from "stimulus"
-import StimulusReflex from "stimulus_reflex"
+import { Controller } from 'stimulus';
+import StimulusReflex from 'stimulus_reflex';
 
 export default class extends Controller {
   connect() {
@@ -77,83 +147,47 @@ export default class extends Controller {
 
   increment() {
     // trigger a server-side reflex and a client-side page update
+    // pass the step argument with a value of `1` to the reflex method
     this.stimulate('ExampleReflex#increment', 1);
   }
 }
 ```
 
-### app/reflexes/example_reflex.rb
-
+{% code-tabs %}
+{% code-tabs-item title="app/reflexes/example\_reflex.rb" %}
 ```ruby
 class ExampleReflex < StimulusReflex::Reflex
   def increment(step = 1)
-    @count = @count.to_i + step
+    # In a typical Rails app the Rails controller would set the value of @count
+    # after fetching it from a persistent data store
+    # @count = @count.to_i + step
+
+    # To keep this example simple, we use session to store the value
+    session[:count] = session[:count].to_i + step
+    @count = session[:count]
   end
 end
 ```
+{% endcode-tabs-item %}
+{% endcode-tabs %}
 
-The following happens after the `StimulusReflex::Reflex` method call finishes.
-
-1. The page that triggered the reflex is re-rerendered. _Instance variables created in the reflex are available to both the controller and view templates._
-2. The re-rendered HTML is sent to the client over the ActionCable socket.
-3. The page is updated via fast DOM diffing courtesy of morphdom. _While future versions of StimulusReflex might support more granular updates, today the entire body is re-rendered and sent over the socket._
-
-## Advanced Usage
-
-### ActionCable
-
-StimulusReflex will use the ActionCable defaults of `window.App` and `App.cable` if they exist.
-If these defaults do not exist, StimulusReflex will establish a new socket connection.
-
-### Performance
-
-ActionCable emits verbose log messages. Disabling ActionCable logs may improve performance.
-
-```ruby
-# config/application.rb
-
-ActionCable.server.config.logger = Logger.new(nil)
-```
-
-### ActionCable Rooms
-
-You may find the need to restrict notifications to a specific room.
-This can be accomplished by setting the `data-room` attribute on the StimulusController element.
-
-```erb
-<a href="#" data-controller="example" data-action="click->example#increment" data-room="12345">
-```
-
-### Render Delay
-
-An attempt is made to reduce repaint/reflow jitter when users trigger lots of updates.
-
-You can control how long to wait _(think debounce)_ prior to updating the page.
-Simply set the `renderDelay` _(milliseconds)_ option when registering the controller.
-
-```javascript
-export default class extends Controller {
-  connect() {
-    StimulusReflex.register(this, {renderDelay: 200});
-  }
-}
-```
+## How it Works
 
-The default value is `25`.
+Here's what happens whenever a `StimulusReflex::Reflex` is invoked.
 
-## Demo Applications
+1. The page that triggered the reflex is re-rerendered.
+2. The re-rendered HTML is sent to the client over the ActionCable socket.
+3. The page is updated via fast DOM diffing courtesy of morphdom.
 
-Building apps with StimulusReflex should evoke your memories of the original [Rails demo video](https://www.youtube.com/watch?v=Gzj723LkRJY).
+{% hint style="success" %}
+All instance variables created in the reflex are made available to the Rails controller and view.
+{% endhint %}
 
-> Look at all the things I'm **not** doing. -DHH
+{% hint style="info" %}
+**The entire body is re-rendered and sent over the socket.** Smaller scoped DOM updates may come in a future release.
+{% endhint %}
 
-- [TodoMVC](https://github.com/hopsoft/stimulus_reflex_todomvc)
+## Example Applications
 
-<<<<<<< HEAD
-## Contributing
+* [TodoMVC](https://stimulus-reflex-todomvc.herokuapp.com) - An implementation of [TodoMVC](http://todomvc.com/) using [Ruby on Rails](https://rubyonrails.org/), [StimulusJS](https://stimulusjs.org/), and [StimulusReflex](https://github.com/hopsoft/stimulus_reflex). [https://github.com/hopsoft/stimulus\_reflex\_todomvc](https://github.com/hopsoft/stimulus_reflex_todomvc)
 
-This project uses [Standard](https://github.com/testdouble/standard)
-and [Prettier](https://github.com/prettier/prettier) to minimize bike shedding related to code formatting.
-Please run `./bin/standardize` prior submitting pull requests.
-=======
->>>>>>> master

data/Rakefile

@@ -1,4 +1,9 @@
 # frozen_string_literal: true
 
 require "bundler/gem_tasks"
-task default: :spec
+
+task default: [:test]
+
+task :test do
+  puts "Please write some tests..."
+end

data/SUMMARY.md

@@ -0,0 +1,7 @@
+# Table of contents
+
+* [StimulusReflex](README.md)
+* [Lifecycle](lifecycle.md)
+* [Advanced Use](advanced-use.md)
+* [Security](security.md)
+

data/bin/standardize

@@ -1,4 +1,4 @@
 #!/bin/bash
 
 bundle exec standardrb --fix
-cd ./javascript && yarn run prettier --write stimulus_reflex.js
+cd ./javascript && yarn run prettier-standard stimulus_reflex.js

data/lib/stimulus_reflex/channel.rb

@@ -25,21 +25,27 @@ class StimulusReflex::Channel < ActionCable::Channel::Base
     element = StimulusReflex::Element.new(data["attrs"])
 
     begin
-      reflex = reflex_name.constantize.new(self, url: url, element: element)
+      reflex_class = reflex_name.constantize
+      raise ArgumentError.new("#{reflex_name} is not a StimulusReflex::Reflex") unless is_reflex?(reflex_class)
+      reflex = reflex_class.new(self, url: url, element: element)
       delegate_call_to_reflex reflex, method_name, arguments
     rescue => invoke_error
-      logger.error "\e[31mStimulusReflex::Channel Failed to invoke #{target}! #{url} #{invoke_error}\e[0m"
+      return broadcast_error("StimulusReflex::Channel Failed to invoke #{target}! #{url} #{invoke_error}", data)
     end
 
     begin
-      render_page_and_broadcast_morph url, reflex
+      render_page_and_broadcast_morph url, reflex, data
     rescue => render_error
-      logger.error "\e[31mStimulusReflex::Channel Failed to rerender #{url} #{render_error}\e[0m"
+      broadcast_error "StimulusReflex::Channel Failed to re-render #{url} #{render_error}", data
     end
   end
 
   private
 
+  def is_reflex?(reflex_class)
+    reflex_class.ancestors.include? StimulusReflex::Reflex
+  end
+
   def delegate_call_to_reflex(reflex, method_name, arguments = [])
     method = reflex.method(method_name)
     required_params = method.parameters.select { |(kind, _)| kind == :req }
@@ -54,9 +60,9 @@ class StimulusReflex::Channel < ActionCable::Channel::Base
     end
   end
 
-  def render_page_and_broadcast_morph(url, reflex)
+  def render_page_and_broadcast_morph(url, reflex, data = {})
     html = render_page(url, reflex)
-    broadcast_morph url, html if html.present?
+    broadcast_morph url, html, data if html.present?
   end
 
   def render_page(url, reflex)
@@ -90,9 +96,15 @@ class StimulusReflex::Channel < ActionCable::Channel::Base
     controller.response.body
   end
 
-  def broadcast_morph(url, html)
+  def broadcast_morph(url, html, data = {})
     html = extract_body_html(html)
-    cable_ready[stream_name].morph selector: "body", html: html, children_only: true
+    cable_ready[stream_name].morph selector: "body", html: html, children_only: true, stimulus_reflex: data
+    cable_ready.broadcast
+  end
+
+  def broadcast_error(message, data = {})
+    logger.error "\e[31m#{message}\e[0m"
+    cable_ready[stream_name].dispatch_event name: "stimulus-reflex:500", detail: {stimulus_reflex: data.merge(error: message)}
     cable_ready.broadcast
   end
 

data/lib/stimulus_reflex/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module StimulusReflex
-  VERSION = "2.0.0"
+  VERSION = "2.0.1"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: stimulus_reflex
 version: !ruby/object:Gem::Version
-  version: 2.0.0
+  version: 2.0.1
 platform: ruby
 authors:
 - Nathan Hopkins
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2019-09-11 00:00:00.000000000 Z
+date: 2019-09-28 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rack
@@ -145,12 +145,14 @@ executables: []
 extensions: []
 extra_rdoc_files: []
 files:
+- CODE_OF_CONDUCT.md
 - Gemfile
 - Gemfile.lock
 - LICENSE.txt
 - README.md
 - README.md.orig
 - Rakefile
+- SUMMARY.md
 - bin/console
 - bin/setup
 - bin/standardize