From 01bd92711e83a415f781be01ac865e784edd5db8 Mon Sep 17 00:00:00 2001
From: Karine Vieira <kv.vieira1@gmail.com>
Date: Tue, 31 Mar 2026 17:20:28 +0000
Subject: [PATCH] feat(masked-input): add save_unmasked option to submit raw
 value

---
 lib/ruby_ui/masked_input/masked_input.rb           | 12 +++++++++++-
 .../masked_input/masked_input_controller.js        | 13 +++++++++++++
 test/ruby_ui/masked_input_test.rb                  | 14 ++++++++++++++
 3 files changed, 38 insertions(+), 1 deletion(-)

diff --git a/lib/ruby_ui/masked_input/masked_input.rb b/lib/ruby_ui/masked_input/masked_input.rb
index 007fb330..dad098c7 100644
--- a/lib/ruby_ui/masked_input/masked_input.rb
+++ b/lib/ruby_ui/masked_input/masked_input.rb
@@ -2,8 +2,18 @@
 
 module RubyUI
   class MaskedInput < Base
+    def initialize(save_unmasked: false, **attrs)
+      @save_unmasked = save_unmasked
+      super(**attrs)
+    end
+
     def view_template
-      Input(type: "text", **attrs)
+      if @save_unmasked
+        Input(type: "text", **attrs.merge(name: nil))
+        input(type: "hidden", name: attrs[:name], value: attrs[:value])
+      else
+        Input(type: "text", **attrs)
+      end
     end
 
     private
diff --git a/lib/ruby_ui/masked_input/masked_input_controller.js b/lib/ruby_ui/masked_input/masked_input_controller.js
index dfea0945..7683444d 100644
--- a/lib/ruby_ui/masked_input/masked_input_controller.js
+++ b/lib/ruby_ui/masked_input/masked_input_controller.js
@@ -5,5 +5,18 @@ import { MaskInput } from "maska";
 export default class extends Controller {
   connect() {
     new MaskInput(this.element)
+    this.#boundSync = this.#sync.bind(this);
+    this.element.addEventListener("maska", this.#boundSync);
+  }
+
+  disconnect() {
+    this.element.removeEventListener("maska", this.#boundSync);
+  }
+
+  #boundSync = null;
+
+  #sync(event) {
+    const hidden = this.element.nextElementSibling;
+    if (hidden?.type === "hidden") hidden.value = event.detail.unmasked;
   }
 }
diff --git a/test/ruby_ui/masked_input_test.rb b/test/ruby_ui/masked_input_test.rb
index 5e291ef1..2f1a5922 100644
--- a/test/ruby_ui/masked_input_test.rb
+++ b/test/ruby_ui/masked_input_test.rb
@@ -11,5 +11,19 @@ def test_render
     assert_match(/<input type="text"/, output)
     assert_match(/data-controller="ruby-ui--masked-input"/, output)
     assert_match(/data-maska="#####-###"/, output)
+    refute_match(/<input type="hidden"/, output)
+  end
+
+  def test_render_with_save_unmasked
+    output = phlex do
+      RubyUI.MaskedInput(save_unmasked: true, name: "agency", value: "0000", data: {maska: "####"})
+    end
+
+    assert_match(/<input type="text"/, output)
+    assert_match(/<input type="hidden" name="agency" value="0000"/, output)
+    assert_match(/data-maska="####"/, output)
+    assert_match(/data-controller="ruby-ui--masked-input"/, output)
+
+    refute_match(/<input type="text" name="agency" value="0000"/, output)
   end
 end