diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss
index 98a55600104..44afdd28b99 100644
--- a/app/assets/stylesheets/application.scss
+++ b/app/assets/stylesheets/application.scss
@@ -12,7 +12,7 @@ $govuk-page-width: 1140px;
 @import "./components/select-with-search";
 @import "./components/single-image-upload";
 @import "./components/sub-navigation";
-@import "./components/summary-card-component";
+@import "./components/summary-card";
 
 @import "./admin/overrides";
 @import "./admin/layout";
diff --git a/app/assets/stylesheets/components/_summary-card-component.scss b/app/assets/stylesheets/components/_summary-card.scss
similarity index 86%
rename from app/assets/stylesheets/components/_summary-card-component.scss
rename to app/assets/stylesheets/components/_summary-card.scss
index 917a26e5543..890ee1a51dc 100644
--- a/app/assets/stylesheets/components/_summary-card-component.scss
+++ b/app/assets/stylesheets/components/_summary-card.scss
@@ -1,4 +1,4 @@
-.app-c-summary-card-component {
+.app-c-summary-card {
   .govuk-summary-list__key {
     vertical-align: top;
   }
diff --git a/app/views/admin/attachments/_form.html.erb b/app/views/admin/attachments/_form.html.erb
index bf873c781ab..b003b42ee20 100644
--- a/app/views/admin/attachments/_form.html.erb
+++ b/app/views/admin/attachments/_form.html.erb
@@ -42,7 +42,7 @@
       </div>
 
       <div class="govuk-!-margin-bottom-8 app-view-attachments__form-body js-locale-switcher-field">
-        <%= render "components/govspeak-editor", {
+        <%= render "components/govspeak_editor", {
           label: {
             heading_size: "l",
             text: "Body (required)",
diff --git a/app/views/admin/call_for_evidence_responses/_form.html.erb b/app/views/admin/call_for_evidence_responses/_form.html.erb
index 4ed301e1592..fa3b4a0e228 100644
--- a/app/views/admin/call_for_evidence_responses/_form.html.erb
+++ b/app/views/admin/call_for_evidence_responses/_form.html.erb
@@ -34,7 +34,7 @@
     } %>
   <% end %>
 
-  <%= render "components/govspeak-editor", {
+  <%= render "components/govspeak_editor", {
     label: {
       heading_size: "l",
       text: "Summary (required)",
diff --git a/app/views/admin/consultation_responses/_form.html.erb b/app/views/admin/consultation_responses/_form.html.erb
index f54ee260356..c375247d799 100644
--- a/app/views/admin/consultation_responses/_form.html.erb
+++ b/app/views/admin/consultation_responses/_form.html.erb
@@ -35,7 +35,7 @@
     } %>
   <% end %>
 
-  <%= render "components/govspeak-editor", {
+  <%= render "components/govspeak_editor", {
     label: {
       heading_size: "l",
       text: "Summary (required)",
diff --git a/app/views/admin/corporate_information_pages/_standard_fields.html.erb b/app/views/admin/corporate_information_pages/_standard_fields.html.erb
index ca9c12c1d2d..7dc4567818c 100644
--- a/app/views/admin/corporate_information_pages/_standard_fields.html.erb
+++ b/app/views/admin/corporate_information_pages/_standard_fields.html.erb
@@ -3,7 +3,7 @@
   <%= form.hidden_field :lock_version %>
 
   <% unless form.object.persisted? %>
-    <%= render "components/select-with-search", {
+    <%= render "components/select_with_search", {
       id: "edition_corporate_information_page_type_id",
       name: "edition[corporate_information_page_type_id]",
       label: "Type",
@@ -34,7 +34,7 @@
     maxlength: 160,
   } %>
 
-  <%= render "components/govspeak-editor", {
+  <%= render "components/govspeak_editor", {
     label: {
       text: "Body (required)",
       heading_size: "l",
diff --git a/app/views/admin/document_collection_email_subscriptions/_taxonomy_choice.html.erb b/app/views/admin/document_collection_email_subscriptions/_taxonomy_choice.html.erb
index 54b616a9631..71fa1bf7de5 100644
--- a/app/views/admin/document_collection_email_subscriptions/_taxonomy_choice.html.erb
+++ b/app/views/admin/document_collection_email_subscriptions/_taxonomy_choice.html.erb
@@ -1,6 +1,6 @@
 <div>
   <h4 class="govuk-heading-s govuk-!-margin-bottom-2">Choose the topic</h4>
-  <%= render "components/select-with-search", {
+  <%= render "components/select_with_search", {
       label: "Choose a topic from the topic taxonomy. You can only choose one.",
       error_message: flash["selected_taxon_content_id"],
       error_id: flash["selected_taxon_content_id"],
diff --git a/app/views/admin/document_collection_groups/_form.html.erb b/app/views/admin/document_collection_groups/_form.html.erb
index 6751ee48eb2..e83e31283b2 100644
--- a/app/views/admin/document_collection_groups/_form.html.erb
+++ b/app/views/admin/document_collection_groups/_form.html.erb
@@ -11,7 +11,7 @@
     hint: "Name of the group that holds all associated documents",
   } %>
 
-   <%= render "components/govspeak-editor", {
+   <%= render "components/govspeak_editor", {
     label: {
       heading_size: "l",
       text: "Description",
diff --git a/app/views/admin/edition_images/crop.html.erb b/app/views/admin/edition_images/crop.html.erb
index 6f2a66a0c77..7c32efce4de 100644
--- a/app/views/admin/edition_images/crop.html.erb
+++ b/app/views/admin/edition_images/crop.html.erb
@@ -11,7 +11,7 @@
 
       <p class="govuk-body govuk-!-margin-bottom-7 app-js-only">Use your cursor or the arrow keys and “<kbd>+</kbd>” and “<kbd>-</kbd>” to select a part of the image. The part you select will be resized for GOV.UK. The shape is fixed.</p>
 
-      <%= render "components/image-cropper", {
+      <%= render "components/image_cropper", {
         name: "image[image_data][file]",
         src: @data_url,
         filename: @new_image.filename,
diff --git a/app/views/admin/edition_unpublishing/edit.html.erb b/app/views/admin/edition_unpublishing/edit.html.erb
index a5d93cb20cb..b2acff79906 100644
--- a/app/views/admin/edition_unpublishing/edit.html.erb
+++ b/app/views/admin/edition_unpublishing/edit.html.erb
@@ -15,7 +15,7 @@
     <p class="govuk-body govuk-!-margin-bottom-6"><%= @unpublishing.unpublishing_reason.as_sentence.capitalize %></p>
 
     <%= form_for @unpublishing, url: admin_edition_unpublishing_path(@unpublishing.edition) do |f| %>
-      <%= render "components/govspeak-editor", {
+      <%= render "components/govspeak_editor", {
         label: {
           heading_size: "l",
           text: "Public explanation",
diff --git a/app/views/admin/edition_workflow/confirm_unpublish.html.erb b/app/views/admin/edition_workflow/confirm_unpublish.html.erb
index b6e91745981..70a87021389 100644
--- a/app/views/admin/edition_workflow/confirm_unpublish.html.erb
+++ b/app/views/admin/edition_workflow/confirm_unpublish.html.erb
@@ -23,7 +23,7 @@
     },
   }
 
-  withdrawal_public_explanation_field = render("components/govspeak-editor", {
+  withdrawal_public_explanation_field = render("components/govspeak_editor", {
     label: {
       text: "Public explanation",
       bold: true,
@@ -150,7 +150,7 @@
           ],
         } %>
 
-        <%= render "components/govspeak-editor", {
+        <%= render "components/govspeak_editor", {
           label: {
             text: "Public explanation",
             bold: true,
diff --git a/app/views/admin/edition_world_tags/edit.html.erb b/app/views/admin/edition_world_tags/edit.html.erb
index 010004e34a7..965bf94025e 100644
--- a/app/views/admin/edition_world_tags/edit.html.erb
+++ b/app/views/admin/edition_world_tags/edit.html.erb
@@ -25,7 +25,7 @@
     ) do |form| %>
       <%= form.hidden_field :previous_version %>
 
-      <%= render partial: "/components/miller-columns", locals: {
+      <%= render partial: "/components/miller_columns", locals: {
         id: "taxonomy_tag_form[taxons]",
         searchable: true,
         items: @world_taxonomy.all_world_taxons_transformed(@tag_form.selected_taxons),
diff --git a/app/views/admin/editions/_filter_options.html.erb b/app/views/admin/editions/_filter_options.html.erb
index b6309fe086c..20a7b0c64f8 100644
--- a/app/views/admin/editions/_filter_options.html.erb
+++ b/app/views/admin/editions/_filter_options.html.erb
@@ -24,7 +24,7 @@
     <% end %>
 
     <% if filter_by.include?(:author) %>
-      <%= render "components/select-with-search", {
+      <%= render "components/select_with_search", {
         label: "Author",
         id: "author_filter",
         name: "author",
@@ -40,7 +40,7 @@
     <% end %>
 
     <% if filter_by.include?(:organisation) %>
-      <%= render "components/select-with-search", {
+      <%= render "components/select_with_search", {
         label: "Organisation",
         id: "organisation_filter",
         name: "organisation",
@@ -50,7 +50,7 @@
     <% end %>
 
     <% if filter_by.include?(:world_location) %>
-      <%= render "components/select-with-search", {
+      <%= render "components/select_with_search", {
         label: "World location",
         id: "world_location_filter",
         name: "world_location",
@@ -66,7 +66,7 @@
     <% end %>
 
     <% if filter_by.include?(:type) %>
-      <%= render "components/select-with-search", {
+      <%= render "components/select_with_search", {
         label: "Document type",
         id: "type_filter",
         name: "type",
@@ -76,7 +76,7 @@
     <% end %>
 
     <% if filter_by.include?(:state) %>
-      <%= render "components/select-with-search", {
+      <%= render "components/select_with_search", {
         label: "State",
         id: "state_filter",
         name: "state",
diff --git a/app/views/admin/editions/_locale_fields.html.erb b/app/views/admin/editions/_locale_fields.html.erb
index 575f78b40a8..7fc7aa4dbf0 100644
--- a/app/views/admin/editions/_locale_fields.html.erb
+++ b/app/views/admin/editions/_locale_fields.html.erb
@@ -12,7 +12,7 @@
         label: "Create a foreign language only #{edition.model_name.human.downcase}",
         value: "1",
         checked: form.object.primary_locale != "en",
-        conditional: (render "components/select-with-search", {
+        conditional: (render "components/select_with_search", {
           id: "edition_primary_locale",
           name: "edition[primary_locale]",
           label: "Document language",
diff --git a/app/views/admin/editions/_operational_field_fields.html.erb b/app/views/admin/editions/_operational_field_fields.html.erb
index 67843e2f161..6e2cf7c925d 100644
--- a/app/views/admin/editions/_operational_field_fields.html.erb
+++ b/app/views/admin/editions/_operational_field_fields.html.erb
@@ -1,4 +1,4 @@
-<%= render "components/select-with-search", {
+<%= render "components/select_with_search", {
   id: "edition_operational_field_id",
   label: "Field of operation (required)",
   name: "edition[operational_field_id]",
diff --git a/app/views/admin/editions/_organisation_fields.html.erb b/app/views/admin/editions/_organisation_fields.html.erb
index f69bd3b97a3..89e82d8f58e 100644
--- a/app/views/admin/editions/_organisation_fields.html.erb
+++ b/app/views/admin/editions/_organisation_fields.html.erb
@@ -10,7 +10,7 @@
       <% 0.upto(3) do |index| %>
         <% lead_organisation_id = lead_organisation_id_at_index(edition, index) %>
         <% cache_if lead_organisation_id.nil?, "#{taggable_organisations_cache_digest}-lead" do %>
-          <%= render "components/select-with-search", {
+          <%= render "components/select_with_search", {
               id: "edition_lead_organisation_ids_#{index + 1}",
               name: "edition[lead_organisation_ids][]",
               label: "Lead organisation #{index + 1}",
diff --git a/app/views/admin/editions/_standard_fields.html.erb b/app/views/admin/editions/_standard_fields.html.erb
index b8c07815075..e96259b60a5 100644
--- a/app/views/admin/editions/_standard_fields.html.erb
+++ b/app/views/admin/editions/_standard_fields.html.erb
@@ -64,7 +64,7 @@
   </div>
 
   <div class="govuk-!-margin-bottom-8 js-locale-switcher-field">
-    <%= render "components/govspeak-editor", {
+    <%= render "components/govspeak_editor", {
       label: {
         text: "Body" + "#{' (required)' if form.object.body_required?}",
         heading_size: "m",
diff --git a/app/views/admin/historical_accounts/_form.html.erb b/app/views/admin/historical_accounts/_form.html.erb
index 22fe684ebb3..2a0886cca28 100644
--- a/app/views/admin/historical_accounts/_form.html.erb
+++ b/app/views/admin/historical_accounts/_form.html.erb
@@ -58,7 +58,7 @@
         error_items: errors_for_input(historical_account.errors, :died),
       } %>
 
-      <%= render "components/govspeak-editor", {
+      <%= render "components/govspeak_editor", {
         label: {
           heading_size: "l",
           text: "Body (required)",
diff --git a/app/views/admin/news_articles/_news_article_type_fields.html.erb b/app/views/admin/news_articles/_news_article_type_fields.html.erb
index f9d646dae52..e9aaf73fce0 100644
--- a/app/views/admin/news_articles/_news_article_type_fields.html.erb
+++ b/app/views/admin/news_articles/_news_article_type_fields.html.erb
@@ -1,5 +1,5 @@
 <div class="app-view-edition-form__subtype-fields js-app-view-edition-form__subtype-fields" data-format-advice="<%= NewsArticleType::FORMAT_ADVICE %>">
-  <%= render "components/select-with-search", {
+  <%= render "components/select_with_search", {
     name: "edition[news_article_type_id]",
     id: "edition_news_article_type_id",
     label: "News article type (required)",
diff --git a/app/views/admin/operational_fields/_form.html.erb b/app/views/admin/operational_fields/_form.html.erb
index aee1dc1abec..a2e2507e532 100644
--- a/app/views/admin/operational_fields/_form.html.erb
+++ b/app/views/admin/operational_fields/_form.html.erb
@@ -11,7 +11,7 @@
     error_items: errors_for(operational_field.errors, :name),
   } %>
 
-  <%= render "components/govspeak-editor", {
+  <%= render "components/govspeak_editor", {
     label: {
       text: "Description",
       heading_size: "l",
diff --git a/app/views/admin/organisations/_closed_fields.html.erb b/app/views/admin/organisations/_closed_fields.html.erb
index d6b8bdf1718..6b70dd52b1d 100644
--- a/app/views/admin/organisations/_closed_fields.html.erb
+++ b/app/views/admin/organisations/_closed_fields.html.erb
@@ -1,4 +1,4 @@
-<%= render "components/select-with-search", {
+<%= render "components/select_with_search", {
   label: "Reason for closure (required)",
   name: "organisation[govuk_closed_status]",
   id: "organisation_govuk_closed_status",
diff --git a/app/views/admin/organisations/_form.html.erb b/app/views/admin/organisations/_form.html.erb
index c8d54a2ae92..89d731efd13 100644
--- a/app/views/admin/organisations/_form.html.erb
+++ b/app/views/admin/organisations/_form.html.erb
@@ -37,7 +37,7 @@
     error_items: errors_for(organisation.errors, :logo_formatted_name),
   } %>
 
-  <%= render "components/select-with-search", {
+  <%= render "components/select_with_search", {
     label: "Logo crest (required)",
     name: "organisation[organisation_logo_type_id]",
     id: "organisation_organisation_logo_type_id",
@@ -54,7 +54,7 @@
   } %>
 
   <div class="app-view-organisation__form__custom_logo js-view-organisation__form__custom_logo <%= "app-view-organisation__form__custom_logo--hidden" unless organisation.organisation_logo_type_id == OrganisationLogoType::CustomLogo.id %>">
-    <%= render "components/single-image-upload", {
+    <%= render "components/single_image_upload", {
       title: "Custom logo (required)",
       name: "organisation",
       id: "organisation",
@@ -70,7 +70,7 @@
     } %>
   </div>
 
-  <%= render "components/select-with-search", {
+  <%= render "components/select_with_search", {
     label: "Brand colour",
     name: "organisation[organisation_brand_colour_id]",
     id: "organisation_organisation_brand_colour_id",
@@ -87,7 +87,7 @@
   } %>
 
   <%= form.fields_for :default_news_image do |_image_fields| %>
-    <%= render "components/single-image-upload", {
+    <%= render "components/single_image_upload", {
       title: "Default news image",
       name: "organisation[default_news_image_attributes]",
       id: "organisation_default_news_image",
@@ -114,7 +114,7 @@
     error_items: errors_for(organisation.errors, :url),
   } %>
 
-  <%= render "components/select-with-search", {
+  <%= render "components/select_with_search", {
     label: "Organisation type (required)",
     name: "organisation[organisation_type_key]",
     id: "organisation_organisation_type_key",
@@ -265,7 +265,7 @@
       <%= hidden_field_tag "organisation[topical_event_organisations_attributes][][ordering]", topical_event_organisation.ordering %>
       <%= hidden_field_tag "organisation[topical_event_organisations_attributes][][id]", topical_event_organisation.id %>
 
-      <%= render "components/select-with-search", {
+      <%= render "components/select_with_search", {
         label: "Topical Event #{topical_event_organisation.ordering + 1}",
         name: "organisation[topical_event_organisations_attributes][][topical_event_id]",
         id: "organisation_topical_event_ids_#{topical_event_organisation.ordering}",
diff --git a/app/views/admin/people/_form.html.erb b/app/views/admin/people/_form.html.erb
index 9c597a96758..c99bfc239e4 100644
--- a/app/views/admin/people/_form.html.erb
+++ b/app/views/admin/people/_form.html.erb
@@ -58,7 +58,7 @@
   } %>
 
   <%= form.fields_for :image do |_image_fields| %>
-    <%= render "components/single-image-upload", {
+    <%= render "components/single_image_upload", {
       title: "Image",
       name: "person[image_attributes]",
       id: "person_image",
@@ -74,7 +74,7 @@
     } %>
   <% end %>
 
-  <%= render "components/govspeak-editor", {
+  <%= render "components/govspeak_editor", {
     label: {
       text: "Biography",
       heading_size: "l",
diff --git a/app/views/admin/policy_groups/_form.html.erb b/app/views/admin/policy_groups/_form.html.erb
index 07b5fb8fb41..9fab904266c 100644
--- a/app/views/admin/policy_groups/_form.html.erb
+++ b/app/views/admin/policy_groups/_form.html.erb
@@ -33,7 +33,7 @@
     rows: 4,
   } %>
 
-  <%= render "components/govspeak-editor", {
+  <%= render "components/govspeak_editor", {
     label: {
       heading_size: "l",
       text: "Description",
diff --git a/app/views/admin/promotional_feature_items/_form_fields.html.erb b/app/views/admin/promotional_feature_items/_form_fields.html.erb
index b4ca2c6fd26..2b294932fec 100644
--- a/app/views/admin/promotional_feature_items/_form_fields.html.erb
+++ b/app/views/admin/promotional_feature_items/_form_fields.html.erb
@@ -44,7 +44,7 @@
       value: "image",
       text: "Image",
       checked: promotional_feature_item.image.present? || params.dig("promotional_feature", "promotional_feature_items_attributes", "0", "image_or_youtube_video_url") == "image",
-      conditional: render("components/single-image-upload", {
+      conditional: render("components/single_image_upload", {
         name: name,
         id: id,
         page_errors: form.object.errors.any?,
diff --git a/app/views/admin/publications/_publication_type_fields.html.erb b/app/views/admin/publications/_publication_type_fields.html.erb
index e21e38eb316..f8da8ed1684 100644
--- a/app/views/admin/publications/_publication_type_fields.html.erb
+++ b/app/views/admin/publications/_publication_type_fields.html.erb
@@ -1,5 +1,5 @@
 <div class="app-view-edition-form__subtype-fields js-app-view-edition-form__subtype-fields" data-format-advice="<%= PublicationType::FORMAT_ADVICE %>">
-  <%= render "components/select-with-search", {
+  <%= render "components/select_with_search", {
     id: "edition_publication_type_id",
     name: "edition[publication_type_id]",
     label: "Publication type (required)",
diff --git a/app/views/admin/role_appointments/_form.html.erb b/app/views/admin/role_appointments/_form.html.erb
index 57570bb3ccd..4c0a2f539b4 100644
--- a/app/views/admin/role_appointments/_form.html.erb
+++ b/app/views/admin/role_appointments/_form.html.erb
@@ -1,4 +1,4 @@
-<%= render "/components/select-with-search", {
+<%= render "/components/select_with_search", {
   id: "role_appointment_person_id",
   label: "Person (required)",
   heading_size: "l",
diff --git a/app/views/admin/roles/_form.html.erb b/app/views/admin/roles/_form.html.erb
index 91db119c80a..dfae8fd2c95 100644
--- a/app/views/admin/roles/_form.html.erb
+++ b/app/views/admin/roles/_form.html.erb
@@ -100,7 +100,7 @@
     },
   } %>
 
-  <%= render "components/govspeak-editor", {
+  <%= render "components/govspeak_editor", {
     label: {
       text: "Responsibilities",
       heading_size: "l",
diff --git a/app/views/admin/shared/tagging/_taxonomy_group_selector.html.erb b/app/views/admin/shared/tagging/_taxonomy_group_selector.html.erb
index 8f876cd6915..6a8a3f29166 100644
--- a/app/views/admin/shared/tagging/_taxonomy_group_selector.html.erb
+++ b/app/views/admin/shared/tagging/_taxonomy_group_selector.html.erb
@@ -1,5 +1,5 @@
 <% if @topic_taxonomy.ordered_taxons_transformed(tag_form.selected_taxons).count() %>
-  <%= render "/components/miller-columns", {
+  <%= render "/components/miller_columns", {
     id: "taxonomy_tag_form[taxons]",
     searchable: true,
     items: @topic_taxonomy.ordered_taxons_transformed(tag_form.selected_taxons),
diff --git a/app/views/admin/social_media_accounts/_form.html.erb b/app/views/admin/social_media_accounts/_form.html.erb
index fc2af2f683a..7df27660eec 100644
--- a/app/views/admin/social_media_accounts/_form.html.erb
+++ b/app/views/admin/social_media_accounts/_form.html.erb
@@ -2,7 +2,7 @@
   <div class="govuk-grid-column-two-thirds">
     <%= form_for [:admin, socialable, social_media_account] do |form| %>
       <% if I18n.locale == I18n.default_locale %>
-        <%= render "components/select-with-search", {
+        <%= render "components/select_with_search", {
           label: "Service (required)",
           id: "social_media_account_social_media_service_id",
           name: "social_media_account[social_media_service_id]",
diff --git a/app/views/admin/speeches/_speaker_select_field.html.erb b/app/views/admin/speeches/_speaker_select_field.html.erb
index 8437b16c993..446abfc4ecb 100644
--- a/app/views/admin/speeches/_speaker_select_field.html.erb
+++ b/app/views/admin/speeches/_speaker_select_field.html.erb
@@ -1,5 +1,5 @@
 <% cache_if edition.role_appointment_id.nil?, "#{taggable_role_appointments_cache_digest}-design-system" do %>
-  <%= render "components/select-with-search", {
+  <%= render "components/select_with_search", {
     id: "edition_role_appointment_id",
     name: "edition[role_appointment_id]",
     label: "",
diff --git a/app/views/admin/speeches/_speech_type_fields.html.erb b/app/views/admin/speeches/_speech_type_fields.html.erb
index 560751b057f..460ed59bdb0 100644
--- a/app/views/admin/speeches/_speech_type_fields.html.erb
+++ b/app/views/admin/speeches/_speech_type_fields.html.erb
@@ -1,5 +1,5 @@
 <div class="app-view-edition-form__subtype-fields js-app-view-edition-form__subtype-fields" data-format-advice="<%= SpeechType::FORMAT_ADVICE %>">
-  <%= render "components/select-with-search", {
+  <%= render "components/select_with_search", {
     name: "edition[speech_type_id]",
     id: "edition_speech_type_id",
     label: "Speech type",
diff --git a/app/views/admin/statistics_announcements/_filter_options.html.erb b/app/views/admin/statistics_announcements/_filter_options.html.erb
index d403bcc0a20..322ac04baa2 100644
--- a/app/views/admin/statistics_announcements/_filter_options.html.erb
+++ b/app/views/admin/statistics_announcements/_filter_options.html.erb
@@ -15,7 +15,7 @@
       value: @filter.options[:title],
     } %>
 
-    <%= render "components/select-with-search", {
+    <%= render "components/select_with_search", {
       label: "Organisation",
       id: "organisation_filter",
       name: "organisation_id",
diff --git a/app/views/admin/take_part_pages/_form.html.erb b/app/views/admin/take_part_pages/_form.html.erb
index ddf1f3344e2..9b1dbe84484 100644
--- a/app/views/admin/take_part_pages/_form.html.erb
+++ b/app/views/admin/take_part_pages/_form.html.erb
@@ -37,7 +37,7 @@
         id: "take_part_page_summary",
       } %>
 
-      <%= render "components/govspeak-editor", {
+      <%= render "components/govspeak_editor", {
         label: {
           heading_size: "l",
           text: "Body (required)",
@@ -50,7 +50,7 @@
       } %>
 
       <%= form.fields_for :image do |_image_fields| %>
-        <%= render "components/single-image-upload", {
+        <%= render "components/single_image_upload", {
           name: "take_part_page[image_attributes]",
           id: "take_part_page_image",
           image_id: "take_part_page_image_file",
diff --git a/app/views/admin/topical_event_about_pages/_form.html.erb b/app/views/admin/topical_event_about_pages/_form.html.erb
index 0a36faaba2c..ebeaf9ef5ea 100644
--- a/app/views/admin/topical_event_about_pages/_form.html.erb
+++ b/app/views/admin/topical_event_about_pages/_form.html.erb
@@ -34,7 +34,7 @@
     id: "topical_event_about_page_summary",
     error_items: errors_for(topical_event_about_page.errors, :summary),
   } %>
-  <%= render "components/govspeak-editor", {
+  <%= render "components/govspeak_editor", {
     label: {
       text: "Body (required)",
       heading_size: "l",
diff --git a/app/views/admin/topical_events/_form.html.erb b/app/views/admin/topical_events/_form.html.erb
index 8dc7c375c2a..271775a31c4 100644
--- a/app/views/admin/topical_events/_form.html.erb
+++ b/app/views/admin/topical_events/_form.html.erb
@@ -25,7 +25,7 @@
     id: "topical_event_summary",
   } %>
 
-  <%= render "components/govspeak-editor", {
+  <%= render "components/govspeak_editor", {
     label: {
       heading_size: "l",
       text: "Description (required)",
@@ -41,7 +41,7 @@
 
   <div class="govuk-!-margin-bottom-8">
     <%= form.fields_for :logo do |_image_fields| %>
-      <%= render "components/single-image-upload", {
+      <%= render "components/single_image_upload", {
         title: "Logo",
         name: "topical_event[logo_attributes]",
         image_id: "topical_event_logo_file",
diff --git a/app/views/admin/world_location_news/edit.html.erb b/app/views/admin/world_location_news/edit.html.erb
index d82b799fc35..e2ff831d377 100644
--- a/app/views/admin/world_location_news/edit.html.erb
+++ b/app/views/admin/world_location_news/edit.html.erb
@@ -37,7 +37,7 @@
             error_items: errors_for(@world_location_news.errors, :title),
           } %>
 
-          <%= render "components/govspeak-editor", {
+          <%= render "components/govspeak_editor", {
             label: {
               text: "Mission statement",
               heading_size: "l",
diff --git a/app/views/admin/worldwide_offices/_form.html.erb b/app/views/admin/worldwide_offices/_form.html.erb
index ba7de355015..97575f9e120 100644
--- a/app/views/admin/worldwide_offices/_form.html.erb
+++ b/app/views/admin/worldwide_offices/_form.html.erb
@@ -53,7 +53,7 @@
     items: items,
   } %>
 
-  <%= render "components/govspeak-editor", {
+  <%= render "components/govspeak_editor", {
     label: {
       text: "Access and opening times",
       heading_size: "l",
diff --git a/app/views/admin/worldwide_organisations/_form.html.erb b/app/views/admin/worldwide_organisations/_form.html.erb
index 79455bf47af..d205de00f93 100644
--- a/app/views/admin/worldwide_organisations/_form.html.erb
+++ b/app/views/admin/worldwide_organisations/_form.html.erb
@@ -63,7 +63,7 @@
   } %>
 
   <%= form.fields_for :default_news_image do |_image_fields| %>
-    <%= render "components/single-image-upload", {
+    <%= render "components/single_image_upload", {
       title: "Default news image",
       name: "worldwide_organisation[default_news_image_attributes]",
       id: "worldwide_organisation_default_news_image",
diff --git a/app/views/components/_datetime_fields.erb b/app/views/components/_datetime_fields.html.erb
similarity index 100%
rename from app/views/components/_datetime_fields.erb
rename to app/views/components/_datetime_fields.html.erb
diff --git a/app/views/components/_govspeak-editor.html.erb b/app/views/components/_govspeak_editor.html.erb
similarity index 100%
rename from app/views/components/_govspeak-editor.html.erb
rename to app/views/components/_govspeak_editor.html.erb
diff --git a/app/views/components/_image-cropper.html.erb b/app/views/components/_image_cropper.html.erb
similarity index 100%
rename from app/views/components/_image-cropper.html.erb
rename to app/views/components/_image_cropper.html.erb
diff --git a/app/views/components/_miller-columns.html.erb b/app/views/components/_miller_columns.html.erb
similarity index 95%
rename from app/views/components/_miller-columns.html.erb
rename to app/views/components/_miller_columns.html.erb
index 37aad0f5e2a..e8d84b9112f 100644
--- a/app/views/components/_miller-columns.html.erb
+++ b/app/views/components/_miller_columns.html.erb
@@ -24,7 +24,7 @@
   <% end %>
 
   <miller-columns class="miller-columns" for="<%= id %>-list" selected="selected-items" id="<%= id %>" aria-describedby="navigation-instructions">
-    <%= render "components/miller-columns-list", {
+    <%= render "components/miller_columns_list", {
       id: id,
       name: "#{id}[]",
       items: items,
diff --git a/app/views/components/_miller-columns-list.html.erb b/app/views/components/_miller_columns_list.html.erb
similarity index 92%
rename from app/views/components/_miller-columns-list.html.erb
rename to app/views/components/_miller_columns_list.html.erb
index 4b503391b2c..114d1e2b331 100644
--- a/app/views/components/_miller-columns-list.html.erb
+++ b/app/views/components/_miller_columns_list.html.erb
@@ -8,7 +8,7 @@
           <%= item[:label] %>
         </label>
         <% if item[:items].present? %>
-          <%= render "components/miller-columns-list", {
+          <%= render "components/miller_columns_list", {
             id: "#{id}-#{index}",
             name: "#{name}",
             items: item[:items],
diff --git a/app/views/components/_select-with-search.html.erb b/app/views/components/_select_with_search.html.erb
similarity index 100%
rename from app/views/components/_select-with-search.html.erb
rename to app/views/components/_select_with_search.html.erb
diff --git a/app/views/components/_single-image-upload.html.erb b/app/views/components/_single_image_upload.html.erb
similarity index 100%
rename from app/views/components/_single-image-upload.html.erb
rename to app/views/components/_single_image_upload.html.erb
diff --git a/app/views/components/_summary_card.html.erb b/app/views/components/_summary_card.html.erb
index 6aa3866800c..fbdcf0023b5 100644
--- a/app/views/components/_summary_card.html.erb
+++ b/app/views/components/_summary_card.html.erb
@@ -4,7 +4,7 @@
   summary_card_actions ||= []
   rows ||=[]
 %>
-<%= tag.div class: "app-c-summary-card-component", id: id, data: data_attributes do %>
+<%= tag.div class: "app-c-summary-card", id: id, data: data_attributes do %>
   <div class="govuk-summary-card">
     <div class="govuk-summary-card__title-wrapper">
       <h2 class="govuk-summary-card__title"><%= title %></h2>
diff --git a/app/views/components/_translated_textarea.html.erb b/app/views/components/_translated_textarea.html.erb
index bea4b0b683b..7675286b746 100644
--- a/app/views/components/_translated_textarea.html.erb
+++ b/app/views/components/_translated_textarea.html.erb
@@ -11,7 +11,7 @@
 <%= content_tag :div, class: "app-c-translated-textarea", id: id do %>
   <% if govspeak_editor %>
     <div class="app-c-translated-textarea__govspeak_editor">
-      <%= render "components/govspeak-editor", textarea.symbolize_keys %>
+      <%= render "components/govspeak_editor", textarea.symbolize_keys %>
     </div>
   <% else %>
     <div class="app-c-translated-textarea__textarea">
diff --git a/app/views/components/docs/govspeak-editor.yml b/app/views/components/docs/govspeak_editor.yml
similarity index 100%
rename from app/views/components/docs/govspeak-editor.yml
rename to app/views/components/docs/govspeak_editor.yml
diff --git a/app/views/components/docs/image-cropper.yml b/app/views/components/docs/image_cropper.yml
similarity index 100%
rename from app/views/components/docs/image-cropper.yml
rename to app/views/components/docs/image_cropper.yml
diff --git a/app/views/components/docs/miller-columns.yml b/app/views/components/docs/miller_columns.yml
similarity index 100%
rename from app/views/components/docs/miller-columns.yml
rename to app/views/components/docs/miller_columns.yml
diff --git a/app/views/components/docs/select-with-search.yml b/app/views/components/docs/select_with_search.yml
similarity index 100%
rename from app/views/components/docs/select-with-search.yml
rename to app/views/components/docs/select_with_search.yml
diff --git a/app/views/components/docs/single-image-upload.yml b/app/views/components/docs/single_image_upload.yml
similarity index 100%
rename from app/views/components/docs/single-image-upload.yml
rename to app/views/components/docs/single_image_upload.yml
diff --git a/spec/javascripts/components/govspeak-editor.spec.js b/spec/javascripts/components/govspeak-editor-spec.js
similarity index 100%
rename from spec/javascripts/components/govspeak-editor.spec.js
rename to spec/javascripts/components/govspeak-editor-spec.js
diff --git a/spec/javascripts/components/image-cropper.spec.js b/spec/javascripts/components/image-cropper-spec.js
similarity index 100%
rename from spec/javascripts/components/image-cropper.spec.js
rename to spec/javascripts/components/image-cropper-spec.js
diff --git a/spec/javascripts/components/select-with-search.spec.js b/spec/javascripts/components/select-with-search-spec.js
similarity index 100%
rename from spec/javascripts/components/select-with-search.spec.js
rename to spec/javascripts/components/select-with-search-spec.js
diff --git a/test/integration/components/select_with_search_test.rb b/test/integration/components/select_with_search_test.rb
index ca4c06a7c32..b15ad215d5e 100644
--- a/test/integration/components/select_with_search_test.rb
+++ b/test/integration/components/select_with_search_test.rb
@@ -5,7 +5,7 @@ class SelectWithSearchTest < ActionDispatch::IntegrationTest
   include Capybara::DSL
 
   def load_example(name)
-    visit "/component-guide/select-with-search/#{name}/preview"
+    visit "/component-guide/select_with_search/#{name}/preview"
     assert_selector ".app-c-select-with-search[data-module='select-with-search']", count: 1
   end
 
diff --git a/test/views/components/summary_card_test.rb b/test/views/components/summary_card_test.rb
index f1a96dcc530..1e4f25967e0 100644
--- a/test/views/components/summary_card_test.rb
+++ b/test/views/components/summary_card_test.rb
@@ -14,7 +14,7 @@ class SummaryCardTest < ActionView::TestCase
       title: "Title",
     })
 
-    assert_select ".app-c-summary-card-component", count: 1
+    assert_select ".app-c-summary-card", count: 1
     assert_select ".govuk-summary-card__title", text: "Title"
   end
 
@@ -71,7 +71,7 @@ class SummaryCardTest < ActionView::TestCase
       ],
     })
 
-    assert_select ".app-c-summary-card-component", count: 1
+    assert_select ".app-c-summary-card", count: 1
     assert_select ".govuk-summary-card__title", text: "Title"
     assert_select ".govuk-summary-list .govuk-summary-list__row:nth-child(1) .govuk-summary-list__key", text: "Key 1"
     assert_select ".govuk-summary-list .govuk-summary-list__row:nth-child(1) .govuk-summary-list__value", text: "Value 1"