Merge pull request #4474 from alphagov/reorderable-list-component-wra…

…pper Use component wrapper on reorderable list component
alphagov · Dec 5, 2024 · a61847b · a61847b
2 parents 53d0e0a + 2f62756
commit a61847b
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 14 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -9,6 +9,8 @@
 
 ## Unreleased
 
+* Use component wrapper on reorderable list component ([PR #4474](https://github.com/alphagov/govuk_publishing_components/pull/4474))
+
 ## 46.2.0
 
 * Support Welsh devolved nations component ([PR #4440](https://github.com/alphagov/govuk_publishing_components/pull/4440))

diff --git a/app/views/govuk_publishing_components/components/_reorderable_list.html.erb b/app/views/govuk_publishing_components/components/_reorderable_list.html.erb
@@ -3,11 +3,13 @@
 
   items ||= []
   input_name ||= "ordering"
-  data_attributes ||= {}
-  data_attributes[:module] = "reorderable-list"
+
+  component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
+  component_helper.add_class("gem-c-reorderable-list")
+  component_helper.add_data_attribute({ module: "reorderable-list" })
 %>
 
-<%= tag.ol class: "gem-c-reorderable-list", data: data_attributes do %>
+<%= tag.ol(**component_helper.all_attributes) do %>
   <% items.each_with_index do |item, index| %>
     <%= tag.li class: "gem-c-reorderable-list__item" do %>
       <%= tag.div class: "gem-c-reorderable-list__wrapper" do %>

diff --git a/app/views/govuk_publishing_components/components/_share_links.html.erb b/app/views/govuk_publishing_components/components/_share_links.html.erb
@@ -14,19 +14,18 @@
   black_icons ||= false
   black_links ||= false
 
-  classes = %w(gem-c-share-links govuk-!-display-none-print)
-  classes << "gem-c-share-links--stacked" if stacked
-  classes << "gem-c-share-links--columns" if columns
-  classes << "gem-c-share-links--flexbox" if flexbox
-  classes << "gem-c-share-links--square-icons" if square_icons
-  classes << "gem-c-share-links--black-icons" if black_icons
-  classes << "gem-c-share-links--black-links" if black_links
-
-  data_attributes ||= {}
-  ((data_attributes[:module] ||= "") << " " << "ga4-link-tracker").strip! if track_as_sharing || track_as_follow
+  component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
+  component_helper.add_class("gem-c-share-links govuk-!-display-none-print")
+  component_helper.add_class("gem-c-share-links--stacked") if stacked
+  component_helper.add_class("gem-c-share-links--columns") if columns
+  component_helper.add_class("gem-c-share-links--flexbox") if flexbox
+  component_helper.add_class("gem-c-share-links--square-icons") if square_icons
+  component_helper.add_class("gem-c-share-links--black-icons") if black_icons
+  component_helper.add_class("gem-c-share-links--black-links") if black_links
+  component_helper.add_data_attribute({ module: "ga4-link-tracker" }) if track_as_sharing || track_as_follow
 %>
 <% if links.any? %>
-  <%= tag.div(class: classes, data: data_attributes) do %>
+  <%= tag.div(**component_helper.all_attributes) do %>
     <% if title %>
       <h2 class="govuk-heading-s"><%= title %></h2>
     <% end %>

diff --git a/app/views/govuk_publishing_components/components/docs/reorderable_list.yml b/app/views/govuk_publishing_components/components/docs/reorderable_list.yml
@@ -17,6 +17,7 @@ body: |
   you'd receive a submission of `ordering[a]=1&ordering[b]=2`, which Rails can
   translate to `"ordering" => { "a" => "1", "b" => "2" }`.
 
+uses_component_wrapper_helper: true
 accessibility_criteria: |
   Buttons in this component must:
 

diff --git a/app/views/govuk_publishing_components/components/docs/share_links.yml b/app/views/govuk_publishing_components/components/docs/share_links.yml
@@ -13,6 +13,8 @@ body: |
 
 accessibility_criteria: |
   The share link icons must be presentational and ignored by screen readers.
+
+uses_component_wrapper_helper: true
 shared_accessibility_criteria:
   - link
 examples: