phlex-reactive 0.2.3 → 0.2.4

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5644272b11bc8ff62496e05c81f01a92b1925ffe2b471ab123c05df573ee1343
-  data.tar.gz: 56d13ad853e1b6da4e40e8e239838514171b9e908a59ad6db60f6f4a4b199b0e
+  metadata.gz: cd797b375cedb73b2a6f5695bf38a7eddd0a939aca5f8602c661537f6407ad7b
+  data.tar.gz: 994da28bed60c495d87d01fb736e80f19439ca52417f2c70f61a17aa7d15b351
 SHA512:
-  metadata.gz: a489e7a7cdce253735c59c4b5196c52d2051e83f7fb783e7c892cbbd8b9be98934141392d7a84b58b938e80bfd5aba6e4bfe1995888b2b322d232a3fdc207a4a
-  data.tar.gz: b9126364a92d1be370e6db639969803c25936e61910967fe05cac00ce908216dd5fa6f6f2f42f16d3c3c23c813d4e2e1c54614babb96f162f77bd71b6e3a5f6b
+  metadata.gz: 11e13357335ec795cc5d0da9b60da2ce059128fed4f355f3864d037fbf5c0dab692844d3b8dd9d10f0b386e7bccd86ae635b2d2bc17a24e4ed1988bd37ce014e
+  data.tar.gz: 11c0e74b06f6d55818fc65d83336d9ec77eee65422adfe477a5ebc8a83d6dda4ae6f1dad3c6fdf17a9e215cdef5bcc958bcbaa43c3e6d32b02adb15124c372e1

data/CHANGELOG.md

@@ -8,6 +8,24 @@ adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 ### Fixed
 
+- **Reactive save silently dropped rich-text / custom-editor fields.** The
+  client's field auto-collection (`#collectFields`) queried only
+  `input[name], select[name], textarea[name]`, so a named rich-text editor
+  (`lexxy-editor`, `trix-editor`) or any `[contenteditable]` was skipped — a
+  reactive `save` posted an empty value and silently wiped the field, with no
+  error. `#collectFields` now also reads named custom editors and contenteditable
+  elements (by `name` *attribute*, since a plain element has no `name` IDL
+  property), reading the serialized `.value` else the contenteditable text. It
+  only fills a name the standard controls left absent or empty, so a hidden input
+  a rich editor mirrors into (e.g. Trix) still wins when populated. The vendored
+  client copy the system suite runs (`spec/dummy/public/vendor/...`) is now kept
+  byte-identical to source by a guard spec, so the browser tests never validate
+  stale client code again. Closes #8.
+
+## [0.2.3] - 2026-06-24
+
+### Fixed
+
 - **Record-backed components silently lost `reactive_state` every action.** When
   a component declared BOTH `reactive_record` and `reactive_state`, the state
   branch was dead: `reactive_token` signed only the record GID and
@@ -23,6 +41,16 @@ adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
   round trip (only a genuinely absent value falls back to the `initialize`
   default). No API changes. Closes #6.
 
+### Documentation
+
+- Documented the combined record + state identity (the `{c, gid, s}` token
+  shape): the README, `docs/architecture.md`, and `docs/security.md` no longer
+  frame `reactive_record` and `reactive_state` as mutually exclusive. (#9)
+
+## [0.2.2] - 2026-06-24
+
+### Fixed
+
 - **Record-backed component built with a different init keyword by the action
   endpoint vs the broadcast path.** The click path (`Component.from_identity`)
   builds with `reactive_record_key` (the `reactive_record :name`), but the
@@ -37,7 +65,7 @@ adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
   an explicit `def self.model_param_name` override still wins. No API changes.
   Closes #4.
 
-## [0.2.1]
+## [0.2.1] - 2026-06-24
 
 ### Fixed
 
@@ -52,7 +80,7 @@ adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
   the gem eager-loads cleanly. Added a regression spec that calls
   `eager_load_all`. No API changes.
 
-## [0.2.0]
+## [0.2.0] - 2026-06-24
 
 ### Added
 
@@ -71,7 +99,7 @@ adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
   helpers. phlex-reactive still works on Action Cable without pgbus; the
   `exclude:` argument is simply ignored there.
 
-## [0.1.0]
+## [0.1.0] - 2026-06-20
 
 ### Added
 
@@ -95,7 +123,9 @@ adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
   scaffolds a reactive component (and an RSpec spec when the app uses RSpec),
   state-backed by default or record-backed with `--record`.
 
-[Unreleased]: https://github.com/mhenrixon/phlex-reactive/compare/v0.2.1...HEAD
+[Unreleased]: https://github.com/mhenrixon/phlex-reactive/compare/v0.2.2...HEAD
+[0.2.3]: https://github.com/mhenrixon/phlex-reactive/compare/v0.2.2...v0.2.3
+[0.2.2]: https://github.com/mhenrixon/phlex-reactive/compare/v0.2.1...v0.2.2
 [0.2.1]: https://github.com/mhenrixon/phlex-reactive/compare/v0.2.0...v0.2.1
 [0.2.0]: https://github.com/mhenrixon/phlex-reactive/compare/v0.1.0...v0.2.0
 [0.1.0]: https://github.com/mhenrixon/phlex-reactive/releases/tag/v0.1.0

data/README.md

@@ -211,15 +211,21 @@ class Todos::Item < ApplicationComponent
 end
 ```
 
-### 2. State-backed (record-less widgets)
+### 2. State-backed (signed instance vars)
 
-No database row — e.g. a counter or a wizard step. The listed instance vars are
-signed into the token. Keep state small and JSON-serializable.
+Sign small, JSON-serializable instance vars into the token. Use it **alone** for
+a record-less widget (a counter, a wizard step), or **alongside `reactive_record`**
+to carry transient UI state — which field, what mode — next to the row. Both the
+record's GlobalID and the state are signed into one token and rebuilt on each
+action. Keep state small and JSON-serializable.
 
 ```ruby
 reactive_state :count, :step       # signed; rebuilt on each action
 ```
 
+The [inline edit example](docs/examples/inline_edit.md) combines both: a
+`reactive_record :record` plus `reactive_state :attribute, :editing`.
+
 ---
 
 ## Concrete examples
@@ -257,7 +263,7 @@ Use in controllers: `render turbo_stream: Counter.replace(counter)`.
 | Macro / helper | Use |
 |---|---|
 | `reactive_record :name` | Record-backed identity (GlobalID). State = the DB. |
-| `reactive_state :a, :b` | State-backed identity (signed instance vars). Record-less only. |
+| `reactive_state :a, :b` | Signed instance-var identity. Standalone, or combined with `reactive_record` to sign transient UI state alongside the row. |
 | `action :name, params: { x: :integer }` | Declare a client-invokable action + its param schema. **Default-deny.** |
 | `reactive_attrs` | Spread onto the root element: marks it reactive + carries the signed token. |
 | `on(:action, event: "click", **params)` | Spread onto a trigger element. Adds `type=button` for clicks. |
@@ -314,8 +320,10 @@ phlex-reactive is built so the easy path is the safe path — but the boundary i
 real, so read this once.
 
 - **State is never trusted from the client.** The DOM holds a `MessageVerifier`-
-  signed identity (`{component, gid}` or `{component, state}`), not raw state. A
-  tampered class, record, or state value fails signature verification → 400.
+  signed identity — `{component, gid}` (record-backed), `{component, state}`
+  (state-backed), or `{component, gid, state}` when a component declares both —
+  not raw state. A tampered class, record, or state value fails signature
+  verification → 400.
 - **Actions are default-deny.** Only methods declared with `action :name` are
   invokable. A public method without `action` is unreachable.
 - **You must authorize.** The signature proves the *token is yours*, not that

data/app/javascript/phlex/reactive/reactive_controller.js

@@ -122,6 +122,7 @@ export default class extends Controller {
 
   #collectFields() {
     const fields = {}
+    // Standard form controls.
     this.element.querySelectorAll("input[name], select[name], textarea[name]").forEach((field) => {
       if (field.type === "checkbox") {
         fields[field.name] = field.checked
@@ -131,6 +132,25 @@ export default class extends Controller {
         fields[field.name] = field.value
       }
     })
+    // Named rich-text / custom editors (lexxy-editor, trix-editor) and bare
+    // [contenteditable]. These aren't input/select/textarea, so the query above
+    // skips them — without this, a reactive save posts an empty value and
+    // silently wipes the field (issue #8). Read whatever the element exposes:
+    // a custom editor's serialized `.value`, else its contenteditable text.
+    // Only fill a name the standard controls left absent or empty, so a synced
+    // hidden input (e.g. Trix mirrors into one) still wins when populated.
+    this.element
+      .querySelectorAll("[name]:is(lexxy-editor, trix-editor, [contenteditable=''], [contenteditable=true], [contenteditable=plaintext-only])")
+      .forEach((el) => {
+        // A plain element (e.g. a <div contenteditable>) has no `name` IDL
+        // property — only the attribute — so read getAttribute, not el.name.
+        const name = el.getAttribute("name")
+        if (!name) return
+        const existing = fields[name]
+        if (existing == null || existing === "") {
+          fields[name] = el.value ?? el.textContent ?? el.innerHTML ?? ""
+        }
+      })
     return fields
   }
 

data/lib/phlex/reactive/version.rb

@@ -2,6 +2,6 @@
 
 module Phlex
   module Reactive
-    VERSION = "0.2.3"
+    VERSION = "0.2.4"
   end
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: phlex-reactive
 version: !ruby/object:Gem::Version
-  version: 0.2.3
+  version: 0.2.4
 platform: ruby
 authors:
 - Mikael Henriksson