Add Validator component

lib/phlexy_ui/validator.rb

@@ -0,0 +1,35 @@
+# frozen_string_literal: true
+
+module PhlexyUI
+  # @component html class="validator"
+  class Validator < Base
+    def initialize(*, as: :input, **)
+      super(*, **)
+      @as = as
+    end
+
+    def view_template(&block)
+      generate_classes!(
+        # "validator"
+        component_html_class: :validator,
+        modifiers_map: modifiers,
+        base_modifiers:,
+        options:
+      ).then do |classes|
+        public_send(as, class: classes, **options)
+
+        block&.call(self)
+      end
+    end
+
+    def hint(**options, &block)
+      generate_classes!(
+        # "validator-hint"
+        component_html_class: :"validator-hint",
+        options:
+      ).then do |classes|
+        p(class: classes, **options, &block)
+      end
+    end
+  end
+end

spec/lib/phlexy_ui/validator_spec.rb

@@ -0,0 +1,56 @@
+require "spec_helper"
+
+describe PhlexyUI::Validator do
+  subject(:output) { render described_class.new }
+
+  it "is expected to match the formatted HTML" do
+    expected_html = html <<~HTML
+      <input class="validator">
+    HTML
+
+    is_expected.to eq(expected_html)
+  end
+
+  describe "with hint method" do
+    subject(:output) do
+      render described_class.new do |v|
+        v.hint { "Hint text" }
+      end
+    end
+
+    it "renders hint" do
+      expected_html = html <<~HTML
+        <input class="validator">
+        <p class="validator-hint">Hint text</p>
+      HTML
+
+      expect(output).to eq(expected_html)
+    end
+  end
+
+  describe "data" do
+    subject(:output) do
+      render described_class.new(data: {foo: "bar"})
+    end
+
+    it "renders it correctly" do
+      expected_html = html <<~HTML
+        <input class="validator" data-foo="bar">
+      HTML
+
+      expect(output).to eq(expected_html)
+    end
+  end
+
+  describe "passing :as option" do
+    subject(:output) { render described_class.new(as: :div) }
+
+    it "renders as the given tag" do
+      expected_html = html <<~HTML
+        <div class="validator"></div>
+      HTML
+
+      expect(output).to eq(expected_html)
+    end
+  end
+end