Add admin's fieldset component

The fieldset component just wraps a group of fields (or, actually, any
content) within a fieldset tag. It optionally accepts a legend text and
a toggletip component.

Ref. solidusio#5329

admin/app/components/solidus_admin/ui/forms/fieldset/component.erb

@@ -0,0 +1,7 @@
+<%= tag.fieldset(**fieldset_html_attributes) do %>
+  <div class="flex mb-4">
+    <%= legend_tag %>
+    <%= toggletip_tag %>
+  </div>
+  <%= content %>
+<% end %>

admin/app/components/solidus_admin/ui/forms/fieldset/component.rb

@@ -0,0 +1,58 @@
+# frozen_string_literal: true
+
+class SolidusAdmin::UI::Forms::Fieldset::Component < SolidusAdmin::BaseComponent
+  # @param legend [String, nil] The legend of the fieldset.
+  # @param fieldset_attributes [Hash] Attributes to pass to the fieldset tag.
+  # @param legend_attributes [Hash, nil] Attributes to pass to the legend tag.
+  # @param toggletip_attributes [Hash, nil] Attributes to pass to a toggletip
+  #   component that will be rendered after the legend.
+  def initialize(
+    legend: nil,
+    fieldset_attributes: {},
+    legend_attributes: {},
+    toggletip_attributes: {},
+    toggletip_component: component("ui/toggletip")
+  )
+    @legend = legend
+    @fieldset_attributes = fieldset_attributes
+    @legend_attributes = legend_attributes
+    @toggletip_attributes = toggletip_attributes
+    @toggletip_component = toggletip_component
+  end
+
+  def fieldset_html_attributes
+    {
+      class: fieldset_classes,
+      **@fieldset_attributes.except(:class)
+    }
+  end
+
+  def fieldset_classes
+    %w[p-6 mb-6 border border-gray-100 rounded-lg] + Array(@fieldset_attributes[:class]).compact
+  end
+
+  def legend_tag
+    return "" unless @legend
+
+    tag.legend(@legend, **legend_html_attributes)
+  end
+
+  def legend_html_attributes
+    {
+      class: legend_classes,
+      **@legend_attributes.except(:class)
+    }
+  end
+
+  def legend_classes
+    %w[body-title mr-2] + Array(@legend_attributes[:class]).compact
+  end
+
+  def toggletip_tag
+    return "" unless @toggletip_attributes.any?
+
+    tag.div do
+      render @toggletip_component.new(**@toggletip_attributes)
+    end
+  end
+end

admin/spec/components/previews/solidus_admin/ui/forms/fieldset/component_preview.rb

@@ -0,0 +1,44 @@
+# frozen_string_literal: true
+
+# @component "ui/forms/fieldset"
+class SolidusAdmin::UI::Forms::Fieldset::ComponentPreview < ViewComponent::Preview
+  include SolidusAdmin::Preview
+
+  # The fieldset component is used to render a set of fields in a form.
+  #
+  # In its most basic form, it wraps the yielded content in a fieldset tag:
+  #
+  # ```erb
+  # <%= render components('ui/forms/fieldset').new do %>
+  #   <%= # ... %>
+  # <% end %>
+  # ```
+  #
+  # The legend of the fieldset can be set with the `legend` option:
+  #
+  # ```erb
+  # <%= render components('ui/forms/fieldset').new(
+  #   legend: "My fieldset"
+  # ) do %>
+  #   <%= # ... %>
+  # <% end %>
+  # ```
+  #
+  # Lastly, a toggletip can be added to the legend with the
+  # `toggletip_attributes`, which will be passed to the [toggletip
+  # component](../../toggletip):
+  #
+  # ```erb
+  # <%= render components('ui/forms/fieldset').new(
+  #   legend: "My fieldset",
+  #   toggletip_attributes: {
+  #     guide: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
+  #     position: :right
+  #   }
+  # ) do %>
+  #  <%= # ... %>
+  # <% end %>
+  # ```
+  def overview
+  end
+end

admin/spec/components/previews/solidus_admin/ui/forms/fieldset/component_preview/overview.html.erb

@@ -0,0 +1,48 @@
+<%= form_with(url: "#", scope: :overview, method: :get, class: "w-full") do |form| %>
+  <div class="flex gap-4">
+    <div class="flex-1">
+      <%= render current_component.new do %>
+        <%=
+          render component('ui/forms/text_field').new(
+            field: :name,
+            form: form,
+            errors: {}
+          )
+        %>
+      <% end %>
+    </div>
+    <div class="flex-1">
+      <%= render current_component.new(legend: "Legend") do %>
+        <%=
+          render component('ui/forms/text_field').new(
+            field: :name,
+            form: form,
+            errors: {}
+          )
+        %>
+      <% end %>
+    </div>
+    <div class="flex-1">
+      <%= render current_component.new(toggletip_attributes: { guide: "Lorem ipsum dolor est." }) do %>
+        <%=
+          render component('ui/forms/text_field').new(
+            field: :name,
+            form: form,
+            errors: {}
+          )
+        %>
+      <% end %>
+    </div>
+    <div class="flex-1">
+      <%= render current_component.new(legend: "Legend & tip", toggletip_attributes: { guide: "Lorem ipsum dolor est.", position: :left, theme: :dark }) do %>
+        <%=
+          render component('ui/forms/text_field').new(
+            field: :name,
+            form: form,
+            errors: {}
+          )
+        %>
+      <% end %>
+    </div>
+  </div>
+<% end %>

admin/spec/components/solidus_admin/ui/forms/fieldset/component_spec.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+require "spec_helper"
+
+RSpec.describe SolidusAdmin::UI::Forms::Fieldset::Component, type: :component do
+  it "renders the overview preview" do
+    render_preview(:overview)
+  end
+end