Support system arguments for ActionList item anchor tags (#1439)

primer · Oct 3, 2022 · 56fae75 · 56fae75
1 parent b0329cd
commit 56fae75
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 7 deletions.
diff --git a/.changeset/ninety-balloons-reflect.md b/.changeset/ninety-balloons-reflect.md
@@ -0,0 +1,5 @@
+---
+'@primer/view-components': patch
+---
+
+Support system arguments for ActionList item anchor tags
diff --git a/app/components/primer/alpha/action_list/item.rb b/app/components/primer/alpha/action_list/item.rb
@@ -128,6 +128,7 @@ class Item < Primer::Component
         # @param parent [Primer::Alpha::ActionList::Item] This item's parent item. `nil` if this item is at the root. Used internally.
         # @param label [String] Item label.
         # @param label_classes [String] CSS classes that will be added to the label.
+        # @param content_arguments [Hash] <%= link_to_system_arguments_docs %> used to construct the item's anchor or span tag.
         # @param truncate_label [Boolean] Truncate label with ellipsis.
         # @param href [String] Link URL.
         # @param role [String] ARIA role describing the function of the item.
@@ -143,6 +144,7 @@ def initialize(
           list:,
           label:,
           label_classes: nil,
+          content_arguments: {},
           parent: nil,
           truncate_label: false,
           href: nil,
@@ -166,6 +168,7 @@ def initialize(
           @trailing_action_on_hover = false
           @id = id
           @system_arguments = system_arguments
+          @content_arguments = content_arguments
 
           @size = fetch_or_fallback(SIZE_OPTIONS, size, DEFAULT_SIZE)
           @scheme = fetch_or_fallback(SCHEME_OPTIONS, scheme, DEFAULT_SCHEME)
@@ -192,13 +195,12 @@ def initialize(
             )
           }
 
-          @content_arguments = {
-            id: @id,
-            classes: class_names(
-              "ActionListContent",
-              SIZE_MAPPINGS[@size]
-            )
-          }
+          @content_arguments[:id] = @id
+          @content_arguments[:classes] = class_names(
+            @content_arguments[:classes],
+            "ActionListContent",
+            SIZE_MAPPINGS[@size]
+          )
 
           if @href && !@disabled
             @content_arguments[:tag] = :a

diff --git a/static/arguments.json b/static/arguments.json
@@ -123,6 +123,12 @@
         "default": "`nil`",
         "description": "CSS classes that will be added to the label."
       },
+      {
+        "name": "content_arguments",
+        "type": "Hash",
+        "default": "`{}`",
+        "description": "[System arguments](/system-arguments) used to construct the item's anchor or span tag."
+      },
       {
         "name": "truncate_label",
         "type": "Boolean",

diff --git a/test/components/alpha/action_list_test.rb b/test/components/alpha/action_list_test.rb
@@ -63,6 +63,16 @@ def test_list_labelled_by_heading
         id = page.find_css(".ActionList-sectionDivider h3")[0].attributes["id"].value
         assert_selector("ul.ActionListWrap[aria-labelledby='#{id}']")
       end
+
+      def test_allows_content_arguments
+        render_inline(Primer::Alpha::ActionList.new(aria: { label: "List" })) do |c|
+          c.with_item(label: "Item 1", href: "/item1")
+          c.with_item(label: "Item 2", href: "/item2", content_arguments: { data: { foo: "bar" } })
+          c.with_item(label: "Item 3", href: "/item3")
+        end
+
+        assert_selector(".ActionListItem a[data-foo=bar]")
+      end
     end
   end
 end