govuk-design-system-rails 0.10.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: e76e9057f3d50ef6e64379373d685d310d8da0ebd530a8398c90bded0c43540b
+  data.tar.gz: 0fcc31f7dd8d80495fbb1b585777c55436b98b0cc7e548743d6a3bfadee211d2
+SHA512:
+  metadata.gz: 6f92bc3beb2e702f03352c0ebb691b35635ebe2b5f2fa68d21b8fd0a251207ce2e5119a23e5da36312917bf35c691cfeda81a497d8e98a6e8f46e0e7c1d0cbf4
+  data.tar.gz: 7568abab4de1c9a796b58d839548de467069c4ab5911e5399b831a2ad53ffe584a6c546dd33df68d98ff1f9e6d4084c0699ac50b0e178b85dbfd1a3b7debdfb9

data/app/helpers/govuk_design_system/accordion_helper.rb

@@ -0,0 +1,7 @@
+module GovukDesignSystem
+  module AccordionHelper
+    def govukAccordion(kwargs = {})
+      render "components/govuk_accordion", **kwargs
+    end
+  end
+end

data/app/helpers/govuk_design_system/back_link_helper.rb

@@ -0,0 +1,13 @@
+module GovukDesignSystem
+  module BackLinkHelper
+    # Use the [back link component](https://design-system.service.gov.uk/components/back-link/)
+    # to help users go back to the previous page in a multi-page transaction.
+    #
+    # Code based upon [nunjucks template](https://github.com/alphagov/govuk-frontend/blob/master/src/govuk/components/back-link/template.njk)
+    def govukBackLink(href:, text: nil, html: nil, classes: "", attributes: {})
+      attributes[:class] = "govuk-back-link #{classes}"
+
+      link_to (html || text), href, attributes
+    end
+  end
+end

data/app/helpers/govuk_design_system/breadcrumbs_helper.rb

@@ -0,0 +1,7 @@
+module GovukDesignSystem
+  module BreadcrumbsHelper
+    def govukBreadcrumbs(kwargs = {})
+      render "components/govuk_breadcrumbs", **kwargs
+    end
+  end
+end

data/app/helpers/govuk_design_system/button_helper.rb

@@ -0,0 +1,71 @@
+module GovukDesignSystem
+  module ButtonHelper
+    # Based on https://github.com/alphagov/govuk-frontend/blob/master/src/govuk/components/button/template.njk
+    def govukButton(element: nil, text: nil, html: nil, name: nil, type: nil, value: nil, disabled: nil, href: nil, classes: "", attributes: {}, preventDoubleClick: nil, isStartButton: nil)
+      # Set classes for this component
+      attributes[:class] = class_names("govuk-button", classes, { "govuk-button--disabled" => disabled })
+      attributes[:data] ||= {}
+      attributes[:data][:module] ||= "govuk-button"
+
+      # Element should be lower-case if set
+      element&.downcase!
+
+      # Determine type of element to use, if not explicitly set
+      element ||= (href ? "a" : "button")
+
+      if isStartButton
+        iconHtml = '<svg class="govuk-button__start-icon" xmlns="http://www.w3.org/2000/svg" width="17.5" height="19" viewBox="0 0 33 40" aria-hidden="true" focusable="false"><path fill="currentColor" d="M0 0h13l20 20-20 20H0l20-20z"/></svg>'.html_safe
+        attributes[:class] += " govuk-button--start"
+      end
+
+      # Define common attributes we can use for both button and input types
+
+      button_attributes = {}
+
+      if name
+        button_attributes[:name] = name
+      end
+
+      if disabled
+        button_attributes[:disabled] = "disabled"
+        button_attributes["aria-disabled"] = "true"
+      end
+
+      if preventDoubleClick
+        button_attributes["data-prevent-double-click"] = "true"
+      end
+
+      # Actually create a button... or a link!
+      case element
+      when "a"
+
+        attributes[:role] = "button"
+        attributes[:draggable] = "false"
+
+        link_to (href || "#"), attributes do
+          concat(html || text)
+          concat iconHtml.to_s
+        end
+
+      when "button"
+        attributes[:value] = value if value
+        attributes[:type] = type if type
+
+        attributes.merge!(button_attributes)
+
+        tag.button(**attributes) do
+          concat(html || text)
+          concat iconHtml.to_s
+        end
+
+      when "input"
+        attributes[:value] = text
+        attributes[:type] = type || "submit"
+
+        attributes.merge!(button_attributes)
+
+        content_tag "input", attributes
+      end
+    end
+  end
+end

data/app/helpers/govuk_design_system/checkboxes_helper.rb

@@ -0,0 +1,8 @@
+module GovukDesignSystem
+  module CheckboxesHelper
+    def govukCheckboxes(kwargs = {})
+      form = kwargs[:form]
+      render((form.present? ? "form_components/govuk_checkboxes" : "components/govuk_checkboxes"), **kwargs)
+    end
+  end
+end

data/app/helpers/govuk_design_system/components_helper.rb

@@ -0,0 +1,13 @@
+module GovukDesignSystem
+  module ComponentsHelper
+    # Patterns for names and ids can be found in examples here: https://guides.rubyonrails.org/form_helpers.html
+    def get_attribute_name(form, attribute)
+      form.object_name.present? ? "#{form.object_name}[#{attribute}]" : attribute.to_s
+    end
+
+    def get_attribute_id_prefix(form, attribute)
+      initial_name = form.object_name.present? ? "#{form.object_name}_#{attribute}" : attribute.to_s
+      initial_name.gsub(/[\[\]_]+/, "_")
+    end
+  end
+end

data/app/helpers/govuk_design_system/cookie_banner_helper.rb

@@ -0,0 +1,7 @@
+module GovukDesignSystem
+  module CookieBannerHelper
+    def govukCookieBanner(kwargs = {})
+      render "components/govuk_cookie_banner", **kwargs
+    end
+  end
+end

data/app/helpers/govuk_design_system/date_input_helper.rb

@@ -0,0 +1,8 @@
+module GovukDesignSystem
+  module DateInputHelper
+    def govukDateInput(kwargs = {})
+      form = kwargs[:form]
+      render((form.present? ? "form_components/govuk_date_input" : "components/govuk_date_input"), **kwargs)
+    end
+  end
+end

data/app/helpers/govuk_design_system/details_helper.rb

@@ -0,0 +1,32 @@
+module GovukDesignSystem
+  module DetailsHelper
+    # Generates the HTML for the
+    # [Details component](https://design-system.service.gov.uk/components/details/)
+    # from the GOV.UK Design System.
+    #
+    # The method name and parameters are camelCased to follow the convention of
+    # the Nunjucks macros from the GOV.UK Design System, to make it easier to
+    # copy and paste templates from the Prototyping Kit.
+    #
+    #
+    # Implementation based on https://github.com/alphagov/govuk-frontend/blob/master/src/govuk/components/details/
+    #
+    def govukDetails(summaryText: nil, summaryHtml: nil, text: nil, html: nil, id: nil, open: nil, classes: "", attributes: {})
+      attributes.merge!("class" => class_names("govuk-details", classes), id: id, "data-module" => "govuk-details")
+      attributes["open"] = "open" if open
+
+      content_tag("details", attributes) do
+        summary = content_tag("summary", class: "govuk-details__summary") do
+          content_tag("span", class: "govuk-details__summary-text") do
+            summaryHtml || summaryText
+          end
+        end
+        content = content_tag("div", class: "govuk-details__text") do
+          html || text || yield
+        end
+
+        summary + content
+      end
+    end
+  end
+end

data/app/helpers/govuk_design_system/error_message_helper.rb

@@ -0,0 +1,7 @@
+module GovukDesignSystem
+  module ErrorMessageHelper
+    def govukErrorMessage(kwargs = {})
+      render "components/govuk_error_message", **kwargs
+    end
+  end
+end

data/app/helpers/govuk_design_system/error_summary_helper.rb

@@ -0,0 +1,20 @@
+module GovukDesignSystem
+  module ErrorSummaryHelper
+    def govukErrorSummary(kwargs = {})
+      form = kwargs[:form]
+
+      if form.present?
+        errors = kwargs[:errors] || form.object.errors
+        return unless errors.try(:any?)
+
+        kwargs[:titleText] = "There is a problem"
+        kwargs[:errorList] = errors.details.keys.flat_map do |attribute|
+          prefix = get_attribute_id_prefix(form, attribute)
+          errors.full_messages_for(attribute).map { |m| { text: m, href: "##{prefix}-error" } }
+        end
+      end
+
+      render "components/govuk_error_summary", **kwargs
+    end
+  end
+end

data/app/helpers/govuk_design_system/fieldset_helper.rb

@@ -0,0 +1,9 @@
+module GovukDesignSystem
+  # Based on https://github.com/alphagov/govuk-frontend/blob/master/src/govuk/components/fieldset/template.njk
+  module FieldsetHelper
+    def govukFieldset(kwargs = {}, &block)
+      kwargs[:block] = block
+      render "components/govuk_fieldset", **kwargs
+    end
+  end
+end

data/app/helpers/govuk_design_system/file_upload_helper.rb

@@ -0,0 +1,59 @@
+module GovukDesignSystem
+  module FileUploadHelper
+    # Use the [file upload component](https://design-system.service.gov.uk/components/file-upload/)
+    # to help users select and upload a file.
+    #
+    # Code based upon [nunjucks template](https://github.com/alphagov/govuk-frontend/blob/master/src/govuk/components/file-upload/template.njk)
+    def govukFileUpload(id:, name:, label:, value: nil, hint: nil, errorMessage: nil, formGroup: {}, classes: "", attributes: {}, described_by: nil)
+      form_group_classes = "govuk-form-group"
+      form_group_classes += " govuk-form-group--error" if errorMessage
+      form_group_classes += " #{formGroup[:classes]}" if formGroup[:classes]
+
+      # a record of other elements that we need to associate with the input using
+      # aria-describedby – for example hints or error messages
+      described_by ||= ""
+
+      content_tag("div", class: form_group_classes) do
+        concat govukLabel(html: label[:html], text: label[:text], classes: label[:classes], isPageHeading: label[:isPageHeading], attributes: (label[:attributes] || {}), for: id)
+
+        if hint
+          hint_id = "#{id}-hint"
+          described_by += " #{hint_id}"
+
+          concat govukHint(
+            id: hint_id,
+            classes: hint[:classes],
+            attributes: hint[:attributes],
+            html: hint[:html],
+            text: hint[:text]
+          )
+        end
+
+        if errorMessage
+          error_id = "#{id}-error"
+          described_by += " #{error_id}"
+
+          concat govukErrorMessage(
+            id: error_id,
+            classes: errorMessage[:classes],
+            attributes: errorMessage[:attributes],
+            html: errorMessage[:html],
+            text: errorMessage[:text],
+            visuallyHiddenText: errorMessage[:visuallyHiddenText]
+          )
+        end
+
+        attributes[:class] = "govuk-file-upload"
+        attributes[:class] += " govuk-file-upload--error" if errorMessage
+        attributes[:class] += " #{classes}" if classes
+        attributes[:id] = id
+        attributes[:name] = name
+        attributes[:type] = "file"
+        attributes[:value] = value if value
+        attributes["aria-describedby"] = described_by if described_by
+
+        concat content_tag("input", nil, attributes)
+      end
+    end
+  end
+end

data/app/helpers/govuk_design_system/header_helper.rb

@@ -0,0 +1,7 @@
+module GovukDesignSystem
+  module HeaderHelper
+    def govukHeader(kwargs = {})
+      render "components/govuk_header", **kwargs
+    end
+  end
+end

data/app/helpers/govuk_design_system/hint_helper.rb

@@ -0,0 +1,7 @@
+module GovukDesignSystem
+  module HintHelper
+    def govukHint(kwargs = {})
+      render "components/govuk_hint", **kwargs
+    end
+  end
+end

data/app/helpers/govuk_design_system/hmcts_badge_helper.rb

@@ -0,0 +1,7 @@
+module GovukDesignSystem
+  module HmctsBadgeHelper
+    def hmctsBadge(text: "", classes: nil)
+      tag.span(text, class: class_names("hmcts-badge", classes))
+    end
+  end
+end

data/app/helpers/govuk_design_system/hmcts_banner_helper.rb

@@ -0,0 +1,7 @@
+module GovukDesignSystem
+  module HmctsBannerHelper
+    def hmctsBanner(kwargs = {})
+      render "components/hmcts_banner", **kwargs
+    end
+  end
+end

data/app/helpers/govuk_design_system/input_helper.rb

@@ -0,0 +1,8 @@
+module GovukDesignSystem
+  module InputHelper
+    def govukInput(kwargs = {})
+      form = kwargs[:form]
+      render((form.present? ? "form_components/govuk_input" : "components/govuk_input"), **kwargs)
+    end
+  end
+end

data/app/helpers/govuk_design_system/inset_text_helper.rb

@@ -0,0 +1,9 @@
+module GovukDesignSystem
+  # Based on https://github.com/alphagov/govuk-frontend/blob/main/src/govuk/components/inset-text/template.njk
+  module InsetTextHelper
+    def govukInsetText(kwargs = {}, &block)
+      kwargs[:block] = block
+      render "components/govuk_inset_text", **kwargs
+    end
+  end
+end

data/app/helpers/govuk_design_system/label_helper.rb

@@ -0,0 +1,7 @@
+module GovukDesignSystem
+  module LabelHelper
+    def govukLabel(kwargs = {})
+      render "components/govuk_label", **kwargs
+    end
+  end
+end

data/app/helpers/govuk_design_system/notification_banner_helper.rb

@@ -0,0 +1,8 @@
+module GovukDesignSystem
+  module NotificationBannerHelper
+    def govukNotificationBanner(kwargs = {}, &block)
+      kwargs[:block] = block
+      render "components/govuk_notification_banner", **kwargs
+    end
+  end
+end

data/app/helpers/govuk_design_system/phase_banner_helper.rb

@@ -0,0 +1,21 @@
+module GovukDesignSystem
+  module PhaseBannerHelper
+    # Generates the HTML for the
+    # [Phase banner component](https://design-system.service.gov.uk/components/phase-banner/)
+    # from the GOV.UK Design System.
+    #
+    # Use the phase banner component to show users your service is still being worked on.
+    #
+    # Implementation based on https://github.com/alphagov/govuk-frontend/blob/master/src/govuk/components/details/
+    def govukPhaseBanner(text: nil, html: nil, tag: nil, classes: "", attributes: {})
+      attributes["class"] = "govuk-phase-banner #{classes}"
+
+      content_tag("div", attributes) do
+        content_tag("p", { class: "govuk-phase-banner__content" }) do
+          concat govukTag(text: tag[:text], html: tag[:html], classes: "govuk-phase-banner__content__tag #{tag[:classes]}")
+          concat content_tag("span", (html || text), { class: "govuk-phase-banner__text" })
+        end
+      end
+    end
+  end
+end

data/app/helpers/govuk_design_system/radios_helper.rb

@@ -0,0 +1,8 @@
+module GovukDesignSystem
+  module RadiosHelper
+    def govukRadios(kwargs = {})
+      form = kwargs[:form]
+      render((form.present? ? "form_components/govuk_radios" : "components/govuk_radios"), **kwargs)
+    end
+  end
+end

data/app/helpers/govuk_design_system/select_helper.rb

@@ -0,0 +1,8 @@
+module GovukDesignSystem
+  module SelectHelper
+    def govukSelect(kwargs = {})
+      form = kwargs[:form]
+      render((form.present? ? "form_components/govuk_select" : "components/govuk_select"), **kwargs)
+    end
+  end
+end

data/app/helpers/govuk_design_system/skip_link_helper.rb

@@ -0,0 +1,13 @@
+module GovukDesignSystem
+  module SkipLinkHelper
+    # Based on https://github.com/alphagov/govuk-frontend/blob/master/src/govuk/components/skip-link/template.njk
+    def govukSkipLink(text: nil, html: nil, href: "#content", classes: "", attributes: {})
+      attributes["class"] = "govuk-skip-link #{classes}"
+      attributes["href"] = href
+
+      content_tag("a", attributes) do
+        html || text
+      end
+    end
+  end
+end

data/app/helpers/govuk_design_system/summary_list_helper.rb

@@ -0,0 +1,7 @@
+module GovukDesignSystem
+  module SummaryListHelper
+    def govukSummaryList(kwargs = {})
+      render "components/govuk_summary_list", **kwargs
+    end
+  end
+end

data/app/helpers/govuk_design_system/tabs_helper.rb

@@ -0,0 +1,7 @@
+module GovukDesignSystem
+  module TabsHelper
+    def govukTabs(kwargs = {})
+      render "components/govuk_tabs", **kwargs
+    end
+  end
+end

data/app/helpers/govuk_design_system/tag_helper.rb

@@ -0,0 +1,8 @@
+module GovukDesignSystem
+  module TagHelper
+    def govukTag(text: nil, html: nil, classes: "", attributes: {})
+      attributes["class"] = class_names("govuk-tag", classes)
+      content_tag("strong", (html || text), attributes)
+    end
+  end
+end

data/app/helpers/govuk_design_system/textarea_helper.rb

@@ -0,0 +1,8 @@
+module GovukDesignSystem
+  module TextareaHelper
+    def govukTextarea(kwargs = {})
+      form = kwargs[:form]
+      render((form.present? ? "form_components/govuk_textarea" : "components/govuk_textarea"), **kwargs)
+    end
+  end
+end

data/app/helpers/govuk_design_system/warning_text_helper.rb

@@ -0,0 +1,20 @@
+module GovukDesignSystem
+  module WarningTextHelper
+    # Use the [warning text component](https://design-system.service.gov.uk/components/warning-text/)
+    # when you need to warn users about something important, such as legal consequences of an action,
+    # or lack of action, that they might take.
+    #
+    # Implementation based on https://github.com/alphagov/govuk-frontend/tree/master/src/govuk/components/warning-text
+    def govukWarningText(iconFallbackText:, text: nil, html: nil, classes: "", attributes: {})
+      attributes[:class] = "govuk-warning-text #{classes}"
+
+      content_tag("div", attributes) do
+        content_tag("span", "!", class: "govuk-warning-text__icon", "aria-hidden" => "true") +
+          content_tag("strong", class: "govuk-warning-text__text") do
+            content_tag("span", iconFallbackText, class: "govuk-warning-text__assistive") +
+              (html || text)
+          end
+      end
+    end
+  end
+end

data/app/views/components/_govuk_accordion.html.erb

@@ -0,0 +1,44 @@
+<%
+  id = local_assigns[:id]
+  heading_level = local_assigns[:headingLevel].presence || 2
+  div_attributes = {
+    id: id,
+    class: class_names("govuk-accordion", local_assigns[:classes]),
+    data: { module: "govuk-accordion" },
+    "data-i18n" => {}
+  }
+  div_attributes["data-i18n"]["hide-all-sections"] = local_assigns[:hideAllSectionsText] if local_assigns[:hideAllSectionsText].present?
+  div_attributes["data-i18n"]["hide-section"] = local_assigns[:hideSectionText] if local_assigns[:hideSectionText].present?
+  div_attributes["data-i18n"]["hide-section-aria-label"] = local_assigns[:hideSectionAriaLabelText] if local_assigns[:hideSectionAriaLabelText].present?
+  div_attributes["data-i18n"]["show-all-sections"] = local_assigns[:showAllSectionsText] if local_assigns[:showAllSectionsText].present?
+  div_attributes["data-i18n"]["show-section"] = local_assigns[:showSectionText] if local_assigns[:showSectionText].present?
+  div_attributes["data-i18n"]["show-section-aria-label"] = local_assigns[:showSectionAriaLabelText] if local_assigns[:showSectionAriaLabelText].present?
+  div_attributes.merge!(local_assigns[:attributes]) if local_assigns[:attributes].present?
+  div_attributes.delete("data-i18n") if div_attributes["data-i18n"] == {}
+%>
+<%= tag.div(**div_attributes) do %>
+  <% local_assigns[:items].each.with_index(1) do |item, index| %>
+    <% next unless item.present? %>
+    <div class="<%= class_names "govuk-accordion__section", { "govuk-accordion__section--expanded" => item[:expanded] } %>">
+      <div class="govuk-accordion__section-header">
+        <h<%= heading_level %> class="govuk-accordion__section-heading">
+          <span class="govuk-accordion__section-button" id="<%= id %>-heading-<%= index %>">
+            <%= item.dig(:heading, :html).presence || item.dig(:heading, :text) %>
+          </span>
+        </h<%= heading_level %>>
+        <% if item.dig(:summary, :html).present? || item.dig(:summary, :text).present? %>
+          <div class="govuk-accordion__section-summary govuk-body" id="<%= id %>-summary-<%= index %>">
+            <%= item.dig(:summary, :html).presence || item.dig(:summary, :text) %>
+          </div>
+        <% end %>
+      </div>
+      <div id="<%= id %>-content-<%= index %>" class="govuk-accordion__section-content" aria-labelledby="<%= id %>-heading-<%= index %>">
+        <% if item.dig(:content, :html).present? %>
+          <%= item.dig(:content, :html) %>
+        <% elsif item.dig(:content, :text).present? %>
+          <p class="govuk-body"><%= item.dig(:content, :text) %></p>
+        <% end %>
+      </div>
+    </div>
+  <% end %>
+<% end %>

data/app/views/components/_govuk_action_link.html.erb

@@ -0,0 +1,12 @@
+<%
+  link_attributes = {
+    class: class_names("govuk-link", local_assigns[:classes]),
+    href: local_assigns[:href]
+  }.merge!(local_assigns[:attributes] || {})
+%>
+<%= tag.a **link_attributes do %>
+  <%= local_assigns[:html].presence || local_assigns[:text] %>
+  <% if local_assigns[:visuallyHiddenText].present? %>
+    <span class="govuk-visually-hidden"> <%= local_assigns[:visuallyHiddenText] %></span>
+  <% end %>
+<% end %>

data/app/views/components/_govuk_breadcrumbs.html.erb

@@ -0,0 +1,25 @@
+<%
+  div_classes = class_names(
+    "govuk-breadcrumbs",
+    { "govuk-breadcrumbs--collapse-on-mobile" => local_assigns[:collapseOnMobile] },
+    local_assigns[:classes]
+  )
+  div_attributes = {
+    class: div_classes,
+  }.merge!(local_assigns[:attributes].presence || {})
+  items = local_assigns[:items].presence || []
+%>
+<%= tag.div(**div_attributes) do %>
+  <ol class="govuk-breadcrumbs__list">
+    <% items.each do |item| %>
+      <% item_content = item[:html].presence || item[:text] %>
+      <% if item[:href].present? %>
+        <li class="govuk-breadcrumbs__list-item">
+          <%= link_to item_content, item[:href], class: "govuk-breadcrumbs__link", **(item[:attributes] || {}) %>
+        </li>
+      <% else %>
+        <li class="govuk-breadcrumbs__list-item" aria-current="page"><%= item_content %></li>
+      <% end %>
+    <% end %>
+  </ol>
+<% end %>