Add Alert component

lib/phlexy_ui/alert.rb

@@ -0,0 +1,58 @@
+# frozen_string_literal: true
+
+module PhlexyUI
+  class Alert < Base
+    def initialize(*, as: :div, **)
+      super(*, **)
+      @as = as
+    end
+
+    def view_template(&)
+      generate_classes!(
+        component_html_class: :alert,
+        modifiers_map: modifiers,
+        base_modifiers:,
+        options:
+      ).then do |classes|
+        public_send(as, role: :alert, class: classes, **options, &)
+      end
+    end
+
+    private
+
+    register_modifiers(
+      # "sm:alert-info"
+      # "md:alert-info"
+      # "lg:alert-info"
+      info: "alert-info",
+      # "sm:alert-success"
+      # "md:alert-success"
+      # "lg:alert-success"
+      success: "alert-success",
+      # "sm:alert-warning"
+      # "md:alert-warning"
+      # "lg:alert-warning"
+      warning: "alert-warning",
+      # "sm:alert-error"
+      # "md:alert-error"
+      # "lg:alert-error"
+      error: "alert-error",
+      # "sm:alert-neutral"
+      # "md:alert-neutral"
+      # "lg:alert-neutral"
+      neutral: "alert-neutral",
+      # "sm:alert-primary"
+      # "md:alert-primary"
+      # "lg:alert-primary"
+      primary: "alert-primary",
+      # "sm:alert-secondary"
+      # "md:alert-secondary"
+      # "lg:alert-secondary"
+      secondary: "alert-secondary",
+      # "sm:alert-accent"
+      # "md:alert-accent"
+      # "lg:alert-accent"
+      accent: "alert-accent"
+    )
+  end
+end

spec/lib/phlexy_ui/alert_spec.rb

@@ -0,0 +1,37 @@
+require "spec_helper"
+
+describe PhlexyUI::Alert do
+  subject(:output) { render described_class.new }
+
+  describe "rendering a full alert" do
+    let(:component) do
+      Class.new(Phlex::HTML) do
+        def view_template(&)
+          render PhlexyUI::Alert.new(
+            :neutral,
+            primary: false,
+            secondary: true,
+            as: :div,
+            data: {
+              my: :alert
+            }
+          ) do
+            "Alert"
+          end
+        end
+      end
+    end
+
+    subject(:output) do
+      render component.new
+    end
+
+    it "is expected to match the formatted HTML" do
+      expected_html = html <<~HTML
+        <div role="alert" class="alert alert-neutral alert-secondary" data-my="alert">Alert</div>
+      HTML
+
+      is_expected.to eq(expected_html)
+    end
+  end
+end