From 803d58669dc7ce22322d11a097e4d045296cc341 Mon Sep 17 00:00:00 2001
From: Lucas Sousa <ls442336@gmail.com>
Date: Fri, 21 Mar 2025 07:56:00 -0300
Subject: [PATCH 1/2] Add a separator component

---
 lib/ruby_ui/separator/separator.rb | 41 ++++++++++++++++++++++++++++++
 test/ruby_ui/separator_test.rb     | 39 ++++++++++++++++++++++++++++
 2 files changed, 80 insertions(+)
 create mode 100644 lib/ruby_ui/separator/separator.rb
 create mode 100644 test/ruby_ui/separator_test.rb

diff --git a/lib/ruby_ui/separator/separator.rb b/lib/ruby_ui/separator/separator.rb
new file mode 100644
index 00000000..671395a0
--- /dev/null
+++ b/lib/ruby_ui/separator/separator.rb
@@ -0,0 +1,41 @@
+# frozen_string_literal: true
+
+module RubyUI
+  class Separator < Base
+    ORIENTATIONS = %i[horizontal vertical].freeze
+
+    def initialize(as: "div", orientation: :horizontal, decorative: true, **attrs)
+      raise ArgumentError, "Invalid orientation: #{orientation}" unless ORIENTATIONS.include?(orientation.to_sym)
+
+      @as = as
+      @orientation = orientation.to_sym
+      @decorative = decorative
+      super(**attrs)
+    end
+
+    def view_template(&)
+      public_send(@as, **attrs, &)
+    end
+
+    private
+
+    def default_attrs
+      {
+        role: (@decorative ? "none" : "separator"),
+        class: [
+          "shrink-0 bg-border",
+          orientation_classes
+        ],
+        data: {
+          orientation: @orientation
+        }
+      }
+    end
+
+    def orientation_classes
+      return "h-[1px] w-full" if @orientation == :horizontal
+
+      "h-full w-[1px]"
+    end
+  end
+end
diff --git a/test/ruby_ui/separator_test.rb b/test/ruby_ui/separator_test.rb
new file mode 100644
index 00000000..a25d3b2a
--- /dev/null
+++ b/test/ruby_ui/separator_test.rb
@@ -0,0 +1,39 @@
+# frozen_string_literal: true
+
+require "test_helper"
+
+class RubyUI::SeparatorTest < ComponentTest
+  def test_render
+    output = phlex do
+      RubyUI.Separator()
+    end
+
+    assert_match(/div/, output)
+    assert_match(/role="none"/, output)
+    assert_match(/data-orientation="horizontal"/, output)
+  end
+
+  def test_render_with_vertical_orientation
+    output = phlex do
+      RubyUI.Separator(orientation: :vertical)
+    end
+
+    assert_match(/data-orientation="vertical"/, output)
+  end
+
+  def test_render_with_decorative_false
+    output = phlex do
+      RubyUI.Separator(decorative: false)
+    end
+
+    assert_match(/role="separator"/, output)
+  end
+
+  def test_render_with_custom_tag
+    output = phlex do
+      RubyUI.Separator(as: "hr")
+    end
+
+    assert_match(/hr/, output)
+  end
+end

From b5fc427cdcafdb1694082946b1f850e0d490164c Mon Sep 17 00:00:00 2001
From: Lucas Sousa <ls442336@gmail.com>
Date: Mon, 24 Mar 2025 17:54:46 -0300
Subject: [PATCH 2/2] Apply code review suggestions

---
 lib/ruby_ui/separator/separator.rb | 11 ++++-------
 test/ruby_ui/separator_test.rb     |  6 +++---
 2 files changed, 7 insertions(+), 10 deletions(-)

diff --git a/lib/ruby_ui/separator/separator.rb b/lib/ruby_ui/separator/separator.rb
index 671395a0..4c489647 100644
--- a/lib/ruby_ui/separator/separator.rb
+++ b/lib/ruby_ui/separator/separator.rb
@@ -4,17 +4,17 @@ module RubyUI
   class Separator < Base
     ORIENTATIONS = %i[horizontal vertical].freeze
 
-    def initialize(as: "div", orientation: :horizontal, decorative: true, **attrs)
+    def initialize(as: :div, orientation: :horizontal, decorative: true, **attrs)
       raise ArgumentError, "Invalid orientation: #{orientation}" unless ORIENTATIONS.include?(orientation.to_sym)
 
-      @as = as
+      @as = as.to_sym
       @orientation = orientation.to_sym
       @decorative = decorative
       super(**attrs)
     end
 
     def view_template(&)
-      public_send(@as, **attrs, &)
+      tag(@as, **attrs, &)
     end
 
     private
@@ -25,10 +25,7 @@ def default_attrs
         class: [
           "shrink-0 bg-border",
           orientation_classes
-        ],
-        data: {
-          orientation: @orientation
-        }
+        ]
       }
     end
 
diff --git a/test/ruby_ui/separator_test.rb b/test/ruby_ui/separator_test.rb
index a25d3b2a..31a8469e 100644
--- a/test/ruby_ui/separator_test.rb
+++ b/test/ruby_ui/separator_test.rb
@@ -10,7 +10,7 @@ def test_render
 
     assert_match(/div/, output)
     assert_match(/role="none"/, output)
-    assert_match(/data-orientation="horizontal"/, output)
+    assert_match(/h-\[1px\]/, output)
   end
 
   def test_render_with_vertical_orientation
@@ -18,7 +18,7 @@ def test_render_with_vertical_orientation
       RubyUI.Separator(orientation: :vertical)
     end
 
-    assert_match(/data-orientation="vertical"/, output)
+    assert_match(/w-\[1px\]/, output)
   end
 
   def test_render_with_decorative_false
@@ -34,6 +34,6 @@ def test_render_with_custom_tag
       RubyUI.Separator(as: "hr")
     end
 
-    assert_match(/hr/, output)
+    assert_match(/<hr/, output)
   end
 end