From 645aa25a89988464b126e39c9c42a29d8276463f Mon Sep 17 00:00:00 2001
From: Jamie Shark <5520141+jamieshark@users.noreply.github.com>
Date: Wed, 11 Sep 2024 15:02:49 -0500
Subject: [PATCH] Add banner variant arg to SelectPanel.
---
app/components/primer/alpha/select_panel.html.erb | 4 ++--
app/components/primer/alpha/select_panel.rb | 14 ++++++++++++++
previews/primer/alpha/select_panel_preview.rb | 5 ++++-
3 files changed, 20 insertions(+), 3 deletions(-)
diff --git a/app/components/primer/alpha/select_panel.html.erb b/app/components/primer/alpha/select_panel.html.erb
index d9f9eed6d0..d09845b7a3 100644
--- a/app/components/primer/alpha/select_panel.html.erb
+++ b/app/components/primer/alpha/select_panel.html.erb
@@ -11,11 +11,11 @@
<% if show_filter? %>
<% header.with_filter do %>
- <%= render Primer::Alpha::Banner.new(scheme: :danger, mb: 2) do %>
+ <%= render Primer::Alpha::Banner.new(scheme: @banner_variant, mb: 2) do %>
<% if error_content? %>
<%= error_content %>
<% else %>
-
Sorry, something went wrong.
+ ">Sorry, something went wrong.
<% end %>
<% end %>
diff --git a/app/components/primer/alpha/select_panel.rb b/app/components/primer/alpha/select_panel.rb
index a0e8d83311..2420678cd8 100644
--- a/app/components/primer/alpha/select_panel.rb
+++ b/app/components/primer/alpha/select_panel.rb
@@ -311,6 +311,12 @@ def with_avatar_item(**system_arguments)
:none,
].freeze
+ DEFAULT_BANNER_VARIANT = :danger
+ BANNER_VARIANT_OPTIONS = [
+ DEFAULT_BANNER_VARIANT,
+ :warning
+ ].freeze
+
# The URL to fetch search results from.
#
# @return [String]
@@ -331,6 +337,11 @@ def with_avatar_item(**system_arguments)
# @return [Symbol]
attr_reader :select_variant
+ # <%= one_of(Primer::Alpha::SelectPanel::BANNER_VARIANT_OPTIONS) %>
+ #
+ # @return [Symbol]
+ attr_reader :banner_variant
+
# <%= one_of(Primer::Alpha::SelectPanel::FETCH_STRATEGIES) %>
#
# @return [Symbol]
@@ -368,6 +379,7 @@ def with_avatar_item(**system_arguments)
# @param open_on_load [Boolean] Open the panel when the page loads.
# @param anchor_align [Symbol] The anchor alignment of the Overlay. <%= one_of(Primer::Alpha::Overlay::ANCHOR_ALIGN_OPTIONS) %>
# @param anchor_side [Symbol] The side to anchor the Overlay to. <%= one_of(Primer::Alpha::Overlay::ANCHOR_SIDE_OPTIONS) %>
+ # @param banner_variant [Symbol] The scheme for the error banner <%= one_of(Primer::Alpha::SelectPanel::BANNER_VARIANT_OPTIONS) %>
# @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
def initialize(
src: nil,
@@ -388,6 +400,7 @@ def initialize(
open_on_load: false,
anchor_align: Primer::Alpha::Overlay::DEFAULT_ANCHOR_ALIGN,
anchor_side: Primer::Alpha::Overlay::DEFAULT_ANCHOR_SIDE,
+ banner_variant: DEFAULT_BANNER_VARIANT,
**system_arguments
)
raise_if_role_given!(**system_arguments)
@@ -409,6 +422,7 @@ def initialize(
@dynamic_label = dynamic_label
@dynamic_label_prefix = dynamic_label_prefix
@dynamic_aria_label_prefix = dynamic_aria_label_prefix
+ @banner_variant = fetch_or_fallback(BANNER_VARIANT_OPTIONS, banner_variant, DEFAULT_BANNER_VARIANT)
@system_arguments = deny_tag_argument(**system_arguments)
@system_arguments[:id] = @panel_id
diff --git a/previews/primer/alpha/select_panel_preview.rb b/previews/primer/alpha/select_panel_preview.rb
index 6d809a180c..04a6e90cd7 100644
--- a/previews/primer/alpha/select_panel_preview.rb
+++ b/previews/primer/alpha/select_panel_preview.rb
@@ -17,6 +17,7 @@ class SelectPanelPreview < ViewComponent::Preview
# @param open_on_load toggle
# @param anchor_align [Symbol] select [start, center, end]
# @param anchor_side [Symbol] select [outside_bottom, outside_top, outside_left, outside_right]
+ # @param banner_variant [Symbol] select [danger, warning]
# @param selected_items text
def playground(
title: "Sci-fi equipment",
@@ -31,6 +32,7 @@ def playground(
open_on_load: false,
anchor_align: :start,
anchor_side: :outside_bottom,
+ banner_variant: :danger,
selected_items: "Phaser"
)
render_with_template(locals: {
@@ -47,7 +49,8 @@ def playground(
dynamic_aria_label_prefix: dynamic_aria_label_prefix,
open_on_load: open_on_load,
anchor_align: anchor_align,
- anchor_side: anchor_side
+ anchor_side: anchor_side,
+ banner_variant: banner_variant
}
})
end