publishing_platform_publishing_components 0.1.0

data/app/views/publishing_platform_publishing_components/components/_attachment.html.erb

@@ -0,0 +1,91 @@
+<%
+  attachment = PublishingPlatformPublishingComponents::Presenters::AttachmentHelper.new(attachment)
+  target ||= "_self"
+  attributes = []
+  local_assigns[:margin_bottom] ||= 3
+  shared_helper = PublishingPlatformPublishingComponents::Presenters::SharedHelper.new(local_assigns)
+
+  component_helper = PublishingPlatformPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
+  component_helper.add_class("gem-c-attachment")
+
+  case attachment.type
+  when "file"
+    if attachment.content_type_name
+      content = if attachment.content_type_abbr
+                  raw tag.abbr(attachment.content_type.abbr,
+                              title: attachment.content_type_name,
+                              class: "gem-c-attachment__abbr")
+                else
+                  attachment.content_type_name
+                end
+      attributes << tag.span(content, class: "gem-c-attachment__attribute")
+    end
+
+    if attachment.file_size
+      attributes << tag.span(
+        number_to_human_size(attachment.file_size),
+        class: "gem-c-attachment__attribute",
+      )
+    end
+
+    if attachment.number_of_pages
+      attributes << tag.span(
+        "#{attachment.number_of_pages} pages",
+        class: "gem-c-attachment__attribute",
+      )
+    end
+
+  when "html"
+    attributes << tag.span(
+      "HTML",
+      class: "gem-c-attachment__attribute",
+    )
+  when "external"
+    attributes << tag.span(
+      attachment.url,
+      class: "gem-c-attachment__attribute",
+    )
+  end
+%>
+<%= tag.section(**component_helper.all_attributes) do %>
+  <%= tag.div class: "gem-c-attachment__thumbnail" do %>
+    <%= link_to attachment.url,
+                target: target,
+                tabindex: "-1",
+                "aria-hidden": true do %>
+      <% if attachment.thumbnail_url.present? %>
+        <% image_tag(attachment.thumbnail_url, alt: "", class: "gem-c-attachment__thumbnail-image gem-c-attachment__thumbnail-image--custom") %>
+      <% elsif attachment.html? %>
+        <%= render "publishing_platform_publishing_components/components/attachment/thumbnail_html" %>
+      <% elsif attachment.document? %>
+        <%= render "publishing_platform_publishing_components/components/attachment/thumbnail_document" %>
+      <% elsif attachment.spreadsheet? %>
+        <%= render "publishing_platform_publishing_components/components/attachment/thumbnail_spreadsheet" %>
+      <% elsif attachment.pdf? %>
+        <%= render "publishing_platform_publishing_components/components/attachment/thumbnail_pdf" %>
+      <% elsif attachment.external? %>
+        <%= render "publishing_platform_publishing_components/components/attachment/thumbnail_external" %>
+      <% else %>
+        <%= render "publishing_platform_publishing_components/components/attachment/thumbnail_generic" %>
+      <% end %>
+    <% end %>
+  <% end %>
+
+  <%= tag.div class: "gem-c-attachment__details" do %>
+    <%= content_tag(shared_helper.get_heading_level, class: "gem-c-attachment__title") do %>
+      <%= link_to attachment.title, attachment.url, target: target %>
+    <% end %>
+
+    <% if attachment.reference.present? %>
+      <%= tag.p "Ref: #{attachment.reference}", class: "gem-c-attachment__metadata gem-c-attachment__metadata--compact" %>
+    <% end %>
+
+    <% if attributes.any? %>
+      <%= tag.p raw(attributes.join(", ")), class: "gem-c-attachment__metadata" %>
+    <% end %>
+
+    <% if attachment.preview_url.present? %>
+      <%= tag.p link_to("View online", attachment.preview_url, "aria-label": "View #{attachment.title}", class: "gem-c-attachment__metadata") %>
+    <% end %>
+  <% end %>
+<% end %>

data/app/views/publishing_platform_publishing_components/components/_error_summary.html.erb

@@ -0,0 +1,38 @@
+<%
+  id ||= "error-summary-#{SecureRandom.hex(4)}"
+  title ||= false
+  description ||= false
+  items ||= []
+  if items.empty? && !title
+    raise ArgumentError, "The error_summary component needs at least one item or a title in order to render."
+  end  
+
+  component_helper = PublishingPlatformPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
+  component_helper.add_class("gem-c-error-summary alert alert-danger")  
+  component_helper.add_role("alert") 
+%>
+<%= tag.div(**component_helper.all_attributes) do %>
+  <% if title %>
+    <h2 class="alert-heading"><%= title %></h2>
+  <% end %>
+  
+  <% if description %>
+    <p><%= description %></p>
+  <% end %>    
+  
+  <% if items.present? %>
+    <ul class="list-unstyled mb-0">
+      <% items.each_with_index do |item, index| %>
+        <li>
+          <% if item[:href] %>
+            <%= link_to item[:text], item[:href], target: item[:target], data: item[:data_attributes] %>
+          <% else %>
+            <%= tag.span data: item[:data_attributes] do %>
+              <%= item[:text] %>
+            <% end %>
+          <% end %>
+        </li>
+      <% end %>
+    </ul>
+  <% end %>
+<% end %>

data/app/views/publishing_platform_publishing_components/components/_summary_list.html.erb

@@ -0,0 +1,135 @@
+<%
+  local_assigns[:heading_level] ||= 3
+  local_assigns[:heading_size] ||= 4
+  shared_helper = PublishingPlatformPublishingComponents::Presenters::SharedHelper.new(local_assigns)
+
+  title ||= nil
+  borderless ||= false
+  edit ||= {}
+  delete ||= {}
+  items ||= []
+  block ||= yield
+  wide_title ||= false
+
+  component_helper = PublishingPlatformPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
+  component_helper.add_class("gem-c-summary-list")
+%>
+<% if title || items.any? %>
+  <%= tag.div(**component_helper.all_attributes) do %>
+    <% if title %>
+      <%= content_tag(shared_helper.get_heading_level, title, class: "#{shared_helper.get_heading_size} gem-c-summary-list__group-title") %>
+
+      <% if edit.any? %>
+        <% edit_main_link = capture do %>
+          <%
+            edit_section_link_text = edit[:link_text] || "Change"
+          %>
+          <%= link_to edit.fetch(:href),
+                    data: edit.fetch(:data_attributes, {}) do %>
+            <%= edit_section_link_text %><%= tag.span " #{title}", class: "visually-hidden" unless edit[:link_text_no_enhance] -%>
+          <% end %>
+        <% end %>
+      <% end %>
+
+      <% if delete.any? %>
+        <% delete_main_link = capture do %>
+          <% delete_section_link_text = delete[:link_text] || "Delete" %>
+          <%= link_to delete.fetch(:href),
+                class: "link-danger",
+                data: delete.fetch(:data_attributes, {}) do %>
+            <%= delete_section_link_text %><%= tag.span " #{title}", class: "visually-hidden" unless delete[:link_text_no_enhance] -%>
+          <% end %>
+        <% end %>
+      <% end %>
+
+      <% if edit_main_link && delete_main_link %>
+        <%= tag.ul class: "gem-c-summary-list__actions-list gem-c-summary-list__group-actions-list" do %>
+          <%- if edit.any? %>
+            <%= tag.li class: "gem-c-summary-list__actions-list-item" do -%>
+              <%= edit_main_link %>
+            <% end %>
+          <% end %>
+          <% if delete.any? %>
+            <%= tag.li class: "gem-c-summary-list__actions-list-item" do -%>
+              <%= delete_main_link %>
+            <% end %>
+          <% end %>
+        <% end %>
+      <% else %>
+        <%= tag.div class: "gem-c-summary-list__group-actions-list" do %>
+          <%= edit_main_link %>
+          <%= delete_main_link %>
+        <% end %>
+      <% end %>
+    <% end %>
+
+    <% any_body_actions = items.detect { |item| item.has_key?("edit") || item.has_key?("delete") } %>
+    <% if items.any? %>
+      <%= tag.dl class: "gem-c-summary-list__items" do %>
+        <% items.each do |item| %>
+          <%
+            item_body_actions = (item.fetch(:edit, {}).any? || item.fetch(:delete, {}).any?)
+
+            if any_body_actions.present? && item_body_actions.blank?
+              classes = "gem-c-summary-list__row gem-c-summary-list__row--no-actions"
+            else
+              classes = "gem-c-summary-list__row"
+            end
+          %>
+          <%= tag.div class: classes, data: item[:data] do %>
+
+            <%= tag.dt item[:field], class: "gem-c-summary-list__key" %>
+            <%= tag.dd item[:value], class: "gem-c-summary-list__value" %>
+
+            <% if item.fetch(:edit, {}).any? %>
+              <% edit_link = capture do %>
+                <% edit_link_text = item[:edit][:link_text] || "Change" %>
+                <%= link_to item[:edit].fetch(:href),
+                  data: item[:edit].fetch(:data_attributes, {}) do %>
+                  <%= edit_link_text %>
+                  <%= tag.span " #{item[:field]}", class: "visually-hidden" unless item[:edit][:link_text_no_enhance] -%>
+                <% end %>
+              <% end %>
+            <% end %>
+
+            <% if item.fetch(:delete, {}).any? %>
+              <% delete_link = capture do %>
+                <% delete_link_text = item[:delete][:link_text] || "Delete" %>
+                <%= link_to item[:delete].fetch(:href),
+                      class: "link-danger",
+                      data: item[:delete].fetch(:data_attributes, {}) do %>
+                  <%= delete_link_text %>
+                  <%= tag.span " #{item[:field]}", class: "visually-hidden" unless item[:delete][:link_text_no_enhance] -%>
+                <% end %>
+              <% end %>
+            <% end %>
+
+            <% if edit_link && delete_link %>
+              <%= tag.dd class: "gem-c-summary-list__actions" do %>
+                <%= tag.ul class: "gem-c-summary-list__actions-list" do %>
+                  <% if edit_link %>
+                    <%= tag.li class: "gem-c-summary-list__actions-list-item" do %>
+                      <%= edit_link %>
+                    <% end %>
+                  <% end %>
+                  <% if delete_link %>
+                    <%= tag.li class: "gem-c-summary-list__actions-list-item" do %>
+                      <%= delete_link %>
+                    <% end %>
+                  <% end %>
+                <% end %>
+              <% end %>
+            <% elsif edit_link || delete_link %>
+              <%= tag.dd class: "gem-c-summary-list__actions" do %>
+                <%= edit_link %>
+                <%= delete_link %>
+              <% end %>
+            <% end %>
+          <% end %>
+        <% end %>
+      <% end %>
+    <% end %>
+
+    <%= tag.div block, class: "gem-c-summary__block" if block %>
+    <% end %>
+<% end %>

data/app/views/publishing_platform_publishing_components/components/attachment/_thumbnail_document.html.erb

@@ -0,0 +1,3 @@
+<svg class="gem-c-attachment__thumbnail-image gem-c-attachment__thumbnail-image--document" version="1.1" viewBox="0 0 99 140" width="99" height="140" aria-hidden="true">
+  <path d="M12 12h75v27H12zM12 59h9v9h-9zM12 77h9v9h-9zM12 95h9v9h-9zM12 113h9v9h-9zM30 59h57v9H30zM30 77h39v9H30zM30 95h57v9H30zM30 113h48v9H30z" stroke-width="0" />
+</svg>

data/app/views/publishing_platform_publishing_components/components/attachment/_thumbnail_external.html.erb

@@ -0,0 +1,3 @@
+<svg class="gem-c-attachment__thumbnail-image gem-c-attachment__thumbnail-image--external" version="1.1" viewBox="0 0 99 140" aria-hidden="true">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M21 59H12V68H21V59ZM30 86V77H69V86H30ZM87 104H30V95H87V104ZM78 122H30V113H78V122ZM21 86H12V77H21V86ZM21 122H12V113H21V122ZM21 104H12V95H21V104ZM87 68H30V59H87V68ZM87 39V12H12V39H87ZM77.9699 29.2919H77.9202L75.2756 17H71.2279L68.5088 29.2919H68.4591L66.1249 17H62.2014L66.1746 34.8047H70.5699L73.2145 22.0409L75.9088 34.8047H80.3289L84.3021 17H80.391L77.9699 29.2919ZM53.8195 29.2919H53.8692L56.2903 17H60.2014L56.2282 34.8047H51.8081L49.1138 22.0409L46.4692 34.8047H42.0739L38.1007 17H42.0242L44.3584 29.2919H44.4081L47.1272 17H51.1749L53.8195 29.2919ZM29.7684 29.2919H29.7188L27.0742 17H23.0265L20.3074 29.2919H20.2577L17.9235 17H14L17.9732 34.8047H22.3685L25.0131 22.0409L27.7074 34.8047H32.1275L36.1007 17H32.1896L29.7684 29.2919Z" />
+</svg>

data/app/views/publishing_platform_publishing_components/components/attachment/_thumbnail_generic.html.erb

@@ -0,0 +1,4 @@
+<svg class="gem-c-attachment__thumbnail-image gem-c-attachment__thumbnail-image--generic" version="1.1" viewBox="0 0 84 120" width="84" height="120" aria-hidden="true">
+  <path d="M74.85 5v106H5" fill="none" stroke-miterlimit="10" stroke-width="2" />
+  <path d="M79.85 10v106H10" fill="none" stroke-miterlimit="10" stroke-width="2" />
+</svg>

data/app/views/publishing_platform_publishing_components/components/attachment/_thumbnail_html.html.erb

@@ -0,0 +1,3 @@
+<svg class="gem-c-attachment__thumbnail-image gem-c-attachment__thumbnail-image--html" version="1.1" viewBox="0 0 99 140" width="99" height="140" aria-hidden="true">
+  <path d="M30,95h57v9H30V95z M30,77v9h39v-9H30z M30,122h48v-9H30V122z M12,68h9v-9h-9V68z M12,104h9v-9h-9V104z M12,86h9v-9h-9V86z M12,122h9v-9h-9V122z M87,12v27H12V12H87z M33,17h-4v8h-6v-8h-4v18h4v-7l6,0v7l4,0V17z M49,17H35l0,3h5v15h4V20l5,0V17z M68,17h-4 l-5,6l-5-6h-4v18h4l0-12l5,6l5-6l0,12h4V17z M81,32h-6V17h-4v18h10V32z M30,68h57v-9H30V68z" stroke-width="0" />
+</svg>

data/app/views/publishing_platform_publishing_components/components/attachment/_thumbnail_pdf.html.erb

@@ -0,0 +1,3 @@
+<svg class="gem-c-attachment__thumbnail-image gem-c-attachment__thumbnail-image--pdf" version="1.1" viewBox="0 0 99 140">
+  <path d="M12,59h9v9h-9v-9ZM30,77v9h39v-9H30ZM30,104h57v-9H30v9ZM30,122h48v-9H30v9ZM12,86h9v-9h-9v9ZM12,122h9v-9h-9v9ZM12,104h9v-9h-9v9ZM30,68h57v-9H30v9ZM35.2,21c-.3-.2-.6-.4-1-.5s-.8-.2-1.3-.2h-2.6v5.5h2.6c.5,0,1,0,1.3-.2s.7-.3,1-.5c.3-.2.5-.5.7-.8s.2-.7.2-1.1h0c0-.5,0-.9-.2-1.2-.2-.3-.4-.6-.7-.8h0ZM52.4,21.9c-.4-.5-1-.9-1.6-1.1-.7-.3-1.5-.4-2.4-.4h-2.7v11.5h2.7c.9,0,1.7-.1,2.4-.4s1.2-.7,1.6-1.1c.4-.5.7-1.1.9-1.7.2-.7.3-1.4.3-2.1v-.7c0-.8,0-1.5-.3-2.1-.2-.6-.5-1.2-.9-1.7h0ZM87,12v27H12V12h75ZM39.8,23c0-.9-.1-1.6-.4-2.4-.3-.7-.7-1.4-1.2-1.9-.5-.5-1.2-1-1.9-1.2-.8-.3-1.6-.5-2.5-.5h-7.2v17.9h3.6v-6h3.2c.9,0,1.8-.1,2.6-.5.8-.3,1.4-.7,2-1.2.5-.5,1-1.2,1.3-1.9.3-.7.5-1.5.5-2.4h0ZM57.4,26c0-1.3-.2-2.6-.5-3.7s-.9-2-1.6-2.8c-.7-.8-1.6-1.4-2.7-1.8-1.1-.4-2.3-.6-3.8-.6h-6.6v17.9h6.6c1.5,0,2.7-.2,3.8-.6,1.1-.4,2-1,2.7-1.8.7-.8,1.3-1.7,1.6-2.8.4-1.1.5-2.3.5-3.7h0ZM72.4,17.1h-12.1v17.9h3.6v-7.5h7.8v-3.3h-7.8v-3.8h8.4s0-3.3,0-3.3Z" />
+</svg>

data/app/views/publishing_platform_publishing_components/components/attachment/_thumbnail_spreadsheet.html.erb

@@ -0,0 +1,5 @@
+<svg class="gem-c-attachment__thumbnail-image gem-c-attachment__thumbnail-image--spreadsheet" version="1.1" viewBox="0 0 99 140" width="99" height="140" aria-hidden="true">
+  <path d="M12 12h75v27H12zm0 47h18.75v63H12zm55 2v59H51V61h16m2-2H49v63h20V59z" stroke-width="0" />
+  <path d="M49 61.05V120H32.8V61.05H49m2-2H30.75v63H51V59zm34 2V120H69.05V61.05H85m2-2H67v63h20V59z" stroke-width="0" />
+  <path d="M30 68.5h56.5M30 77.34h56.5M30 112.7h56.5M30 95.02h56.5M30 86.18h56.5M30 103.86h56.5" fill="none" stroke-miterlimit="10" stroke-width="2" />
+</svg>

data/app/views/publishing_platform_publishing_components/components/docs/attachment.yml

@@ -0,0 +1,104 @@
+name: Attachment
+description: Displays a link to download an attachment and metadata about the file
+body: |
+  This component shows a link to a document that is attached to Publishing Platform 
+  content along with a thumbnail and relevant file data.
+
+  It is intended to be rendered in markdown and as an attachment 'preview' in
+  Content Publisher.
+shared_accessibility_criteria:
+- link
+accessibility_criteria: |
+  The thumbnail image, and the link wrapping it, must not focusable or shown to
+  screenreaders.
+uses_component_wrapper_helper: true
+examples:
+  default:
+    data:
+      attachment:
+        title: "Information asset register"
+        url: https://assets.publishing.service.publishing-platform.co.uk/uploads/system/uploads/attachment_data/file/747661/information-asset-register.csv
+        filename: information-asset-register.csv
+        content_type: text/csv
+        file_size: 20000
+  with_number_of_pages:
+    data:
+      attachment:
+        title: "Temporary snow ploughs: guidance note"
+        url: https://assets.publishing.service.publishing-platform.co.uk/uploads/system/uploads/attachment_data/file/259634/temporary-snow-ploughs.pdf
+        filename: temporary-snow-ploughs.pdf
+        content_type: application/pdf
+        file_size: 20000
+        number_of_pages: 7
+  opendocument:
+    data:
+      attachment:
+        title: "Information Asset Register"
+        url: https://assets.publishing.service.publishing-platform.co.uk/uploads/system/uploads/attachment_data/file/744083/Information_Asset_Register_.ods
+        filename: Information_Asset_Register_.ods
+        content_type: application/vnd.oasis.opendocument.spreadsheet
+        file_size: 20000
+  # embedded_in_markdown:
+  #   description: |
+  #     This component can be embedded in markdown with the `[Attachment:]` code.
+  #   embed: |
+  #     <%= render "publishing_platform_publishing_components/components/publishing_platform_markdown" do %>
+  #       <p>Some text.</p>
+  #       <%= component %>
+  #     <% end %>
+  #   data:
+  #     attachment:
+  #       title: "Information asset register"
+  #       url: https://assets.publishing.service.publishing-platform.co.uk/uploads/system/uploads/attachment_data/file/744083/Information_Asset_Register_.ods
+  #       filename: Information_Asset_Register_.ods
+  #       content_type: application/vnd.oasis.opendocument.spreadsheet
+  #       file_size: 20000
+  with_margin_bottom:
+    description: The component accepts a number for margin bottom from `0` to `5`. It defaults to no margin bottom.
+    data:
+      attachment:
+        title: "Information asset register"
+        url: https://assets.publishing.service.publishing-platform.co.uk/uploads/system/uploads/attachment_data/file/747661/information-asset-register.csv
+        filename: information-asset-register.csv
+        content_type: application/pdf
+        file_size: 20000
+      margin_bottom: 9
+  with_custom_heading_level:
+    description: Default is `h2`.
+    data:
+      heading_level: 3
+      attachment:
+        title: "Information asset register"
+        url: https://assets.publishing.service.publishing-platform.co.uk/uploads/system/uploads/attachment_data/file/747661/information-asset-register.csv
+        filename: information-asset-register.csv
+        content_type: text/csv
+        file_size: 20000
+  pdf_attachment:
+    data:
+      attachment:
+        title: "Temporary snow ploughs: guidance note"
+        url: https://assets.publishing.service.publishing-platform.co.uk/uploads/system/uploads/attachment_data/file/259634/temporary-snow-ploughs.pdf
+        filename: temporary-snow-ploughs.pdf
+        content_type: application/pdf
+        file_size: 20000
+  with_preview_link:
+    data:
+      attachment:
+        title: "Finance data: February 2018"
+        url: https://assets.publishing.service.publishing-platform.co.uk/uploads/system/uploads/attachment_data/file/687542/February_2018_Finance_Data.csv
+        filename: February_2018_Finance_Data.csv
+        content_type: text/csv
+        file_size: 51496
+        preview_url: https://assets.publishing.service.publishing-platform.co.uk/uploads/system/uploads/attachment_data/file/687542/February_2018_Finance_Data.csv/preview
+  html_attachment:
+    data:
+      attachment:
+        title: "Smart meters: unlocking the future"
+        url: https://www.publishing-platform.co.uk/publications/smart-meters-unlocking-the-future/smart-meters-unlocking-the-future
+        type: html
+  external_attachment:
+    data:
+      attachment:
+        title: "Architects Registration Board annual report 2021"
+        url: https://arb.org.uk/wpcontent/uploads/ARBAnnualReportandFinancialStatement2021published.pdf
+        type: external

data/app/views/publishing_platform_publishing_components/components/docs/error_summary.yml

@@ -0,0 +1,51 @@
+name: Form error summary
+description: Used at the top of the page, to summarise validation errors.
+accessibility_criteria: |
+  - should be focused on page load, to ensure this error is noticed by assistive tech
+  - list of errors should be clickable and focus the inputs with errors
+shared_accessibility_criteria:
+  - link
+accessibility_excluded_rules:
+  - skip-link # This component is creating references to to sections on the page that do not exist in examples
+examples:
+  default:
+    data:
+      id: error-summary
+      title: Message to alert the user to a problem goes here
+      description: Optional description of the errors and how to correct them
+      items:
+      - text: Descriptive link to the question with an error
+        href: '#example-error-1'
+  with_many_errors:
+    data:
+      title: Message to alert the user to a problem goes here
+      description: Optional description of the errors and how to correct them
+      items:
+      - text: Descriptive link to the question with an error 1
+        href: '#example-error-1'
+      - text: Descriptive link to the question with an error 2
+        href: '#example-error-2'
+      - text: Description of error without link
+  with_data_attributes:
+    description: |
+      The example shown applies a tracking attribute specifically for use by Google Tag Manager.
+      
+      Other data attributes can also be applied as required. Note that the component does not include built in tracking.
+    data:
+      title: Message to alert the user to a problem goes here
+      description: Optional description of the errors and how to correct them
+      data_attributes:
+        tracking: GTM-123AB
+      items:
+      - text: Descriptive link to the question with an error 1
+  with_custom_target_on_links:
+    data:
+      title: Message to alert the user to a problem goes here
+      description: Optional description of the errors and how to correct them
+      items:
+      - text: Descriptive link to the question with an error opening in a new window
+        href: '#example-error-1'
+        target: '_blank'
+      - text: Descriptive link to the question with an error opening in the same window
+        href: '#example-error-2'
+        target: '_self'

data/app/views/publishing_platform_publishing_components/components/docs/summary_list.yml

@@ -0,0 +1,137 @@
+name: Summary list
+description: Use the summary list to summarise information, for example, a user’s responses at the end of a form.
+body:  This component allows the rendering of multiple groups of lists, and actions at the group level.
+accessibility_criteria: |
+  Action links in the component must:
+
+  * indicate what the action refers to (e.g. Change _name_)
+shared_accessibility_criteria:
+  - link
+uses_component_wrapper_helper: true
+examples:
+  default:
+    data: &default-example-data
+      title: "Title, summary and body"
+      items:
+      - field: "Title"
+        value: "Ethical standards for public service providers"
+      - field: "Summary"
+        value: "Find out more about our reviews on the subject of ethical standards for public service providers, including our 2014 report, 2015 guidance and 2018 follow-up publication."
+      - field: "Body"
+        value: "After the government decided in 2013 to expand the remit of the Committee to include public service providers, the Committee on Standards in Public Life produced our first report on the issue: Ethical Standards for Providers of Public Services in 2014."
+
+  without_title:
+    data:
+      items:
+      - field: "Title"
+        value: "Ethical standards for public service providers"
+      - field: "Summary"
+        value: "Find out more about our reviews on the subject of ethical standards for public service providers, including our 2014 report, 2015 guidance and 2018 follow-up publication."
+
+  with_edit_on_section:
+    description: For all links shown in the component, see the <a href="/component-guide/summary_list/with_customised_links">with customised links example</a> for guidance.
+    data:
+      <<: *default-example-data
+      edit:
+        href: "edit-title-summary-body"
+        data_attributes:
+          gtm: "edit-title-summary-body"
+
+  with_delete_on_section:
+    description: For all links shown in the component, see the <a href="/component-guide/summary_list/with_customised_links">with customised links example</a> for guidance.
+    data:
+      <<: *default-example-data
+      delete:
+        href: "delete-title-summary-body"
+        data_attributes:
+          gtm: "delete-title-summary-body"
+
+  with_edit_and_delete_on_section:
+    description: For all links shown in the component, see the <a href="/component-guide/summary_list/with_customised_links">with customised links example</a> for guidance.
+    data:
+      <<: *default-example-data
+      edit:
+        href: "edit-title-summary-body"
+        data_attributes:
+          gtm: "edit-title-summary-body"
+      delete:
+        href: "delete-title-summary-body"
+        data_attributes:
+          gtm: "delete-title-summary-body"
+
+  with_customised_links:
+    description: |
+      For all links shown in the component, visually hidden text containing the name of the thing it refers to is automatically appended. This offers a better experience for screen reader users by making the link text unique and more explicit. In the example below, the link text would be `Change Title, summary and body`.
+
+      The text of the link can be customised using the `link_text` option. Take care that the provided `link_text` still makes sense to screen readers when combined with the title. For instance, `Reorder` link text and `Items` title becomes `Reorder Items`, which reads fine, but link text of `Summary` would read as `Summary Items`, which does not make sense.
+
+      To override this behaviour, use `link_text_no_enhance` on the link in question, as shown. This will remove the visually hidden text, allowing you to add your own. The component will render a `span` element with a class of `visually-hidden` included in a passed [capture block](https://apidock.com/rails/ActionView/Helpers/CaptureHelper/capture) as the `link_text` parameter.
+    data:
+      title: "Title, summary and body"
+      items:
+      - field: "Title"
+        value: "Rural conservation techniques"
+        edit:
+          href: "edit-title"
+          text: "Edit"
+          data_attributes:
+            gtm: "edit-title"
+      - field: "Body"
+        value: "Following the land use committee change to overreaching rural byelaws in 2009, further policies were adopted."
+        edit:
+          href: "edit-body"
+          link_text: "Edit"
+        delete:
+          href: "delete-body"
+          link_text: "Remove"
+          link_text_no_enhance: true
+      edit:
+        href: "edit-title-summary-body"
+        link_text: Edit this document <span class="visually-hidden">my hidden text for screenreaders</span>
+        link_text_no_enhance: true
+
+  with_custom_section_heading:
+    data:
+      <<: *default-example-data
+      heading_level: 2
+      heading_size: 1
+
+  with_edit_on_some_individual_items:
+    description: For all links shown in the component, see the <a href="/component-guide/summary_list/with_customised_links">with customised links example</a> for guidance.
+    data:
+      title: "Title, summary and body"
+      items:
+      - field: "Title"
+        value: "Ethical standards for public service providers"
+      - field: "Summary"
+        value: "Find out more about our reviews on the subject of ethical standards for public service providers, including our 2014 report, 2015 guidance and 2018 follow-up publication."
+        edit:
+          href: "edit-summary"
+        delete:
+          href: "delete-summary"
+      - field: "Body"
+        value: "After the government decided in 2013 to expand the remit of the Committee to include public service providers, the Committee on Standards in Public Life produced our first report on the issue: Ethical Standards for Providers of Public Services in 2014."
+        edit:
+          href: "edit-body"
+          link_text: "Edit"
+        delete:
+          href: "delete-body"
+          link_text: "Remove"
+
+  with_data_attributes:
+    description: |
+      Data attributes can be passed to individual items within the component as shown.
+    data:
+      title: "Title, summary and body"
+      items:
+        - field: "Title"
+          value: "Ethical standards for public service providers"
+          data:
+            module: "something"
+
+  with_block:
+    description: Use the summary list with a block when you need to show an empty state message or load another component.
+    data:
+      title: "Topics"
+      block: |
+        <p>No topics specified for this document.</p>

data/config/initializers/assets.rb

@@ -0,0 +1,24 @@
+return unless Rails.application.config.respond_to?(:assets)
+
+# Include the govuk_publishing_components manifest into list of assets to
+# be pre-compiled. This allows that the same Sprockets manifest to be used 0
+# with Sprockets 3 and 4 without applications needing to manually require it.
+#
+# In future we may want applications to link directly to this from their
+# manifest file as the use of `config.assets.precompile` is discouraged
+# from version 4: https://github.com/rails/sprockets/blob/58cca17aa447fcee17703e4ab4dbfaab630e7ed4/UPGRADING.md
+Rails.application.config.assets.precompile += %w[publishing_platform_publishing_components_manifest.js]
+
+Rails.application.config.assets.paths << Rails.root.join("node_modules")
+
+Rails.application.config.assets.paths += %W[
+  #{__dir__}/../../node_modules/bootstrap/scss
+  #{__dir__}/../../node_modules/
+]
+
+# We've experienced segmentation faults when pre-compiling assets with libsass.
+# Disabling Sprockets 4's export_concurrent setting seems to resolve the issues
+# see: https://github.com/rails/sprockets/issues/633
+Rails.application.config.assets.configure do |env|
+  env.export_concurrent = false if env.respond_to?(:export_concurrent=)
+end

data/config/routes.rb

@@ -0,0 +1,2 @@
+PublishingPlatformPublishingComponents::Engine.routes.draw do
+end

data/lib/publishing_platform_publishing_components/config.rb

@@ -0,0 +1,25 @@
+module PublishingPlatformPublishingComponents
+  def self.configure
+    yield(Config)
+  end
+
+  module Config
+    APP_COMPONENT_DIRECTORY = "components".freeze
+
+    def self.component_directory_name
+      APP_COMPONENT_DIRECTORY
+    end
+
+    def self.gem_directory
+      Gem::Specification.find_by_name("publishing_platform_publishing_components").gem_dir
+    end
+
+    def self.all_stylesheets
+      stylesheets = Dir.glob("#{gem_directory}/app/assets/stylesheets/publishing_platform_publishing_components/components/*.scss")
+
+      stylesheets.index_with do |path|
+        "publishing_platform_publishing_components/components/#{File.basename(path, '.*')}.css"
+      end
+    end
+  end
+end

data/lib/publishing_platform_publishing_components/engine.rb

@@ -0,0 +1,5 @@
+module PublishingPlatformPublishingComponents
+  class Engine < ::Rails::Engine
+    isolate_namespace PublishingPlatformPublishingComponents
+  end
+end