govuk-components 3.0.4 → 3.1.0

data/app/components/govuk_component/pagination_component/adjacent_page.rb

@@ -0,0 +1,60 @@
+class GovukComponent::PaginationComponent::AdjacentPage < GovukComponent::Base
+  attr_reader :href, :label_text, :text, :suffix, :block_mode, :visually_hidden_text
+  alias_method :block_mode?, :block_mode
+
+  def initialize(href:, suffix:, visually_hidden_text:, text:, block_mode: true, label_text: nil, classes: [], html_attributes: {})
+    @href                 = href
+    @label_text           = label_text
+    @text                 = text
+    @block_mode           = block_mode
+    @suffix               = suffix
+    @visually_hidden_text = visually_hidden_text
+
+    super(html_attributes: html_attributes, classes: classes)
+  end
+
+  def call
+    tag.div(**html_attributes) do
+      tag.a(href: href, class: %w(govuk-link govuk-pagination__link), rel: suffix, aria: { label: aria_label }) do
+        safe_join([body, divider, label_content])
+      end
+    end
+  end
+
+private
+
+  def default_attributes
+    { class: ["govuk-pagination__#{suffix}"] }
+  end
+
+  def body
+    [arrow, title_span]
+  end
+
+  def title_span
+    tag.span(text, class: title_classes)
+  end
+
+  def divider
+    return if label_text.blank?
+
+    tag.span(":", class: %w(govuk-visually-hidden))
+  end
+
+  def label_content
+    return if label_text.blank?
+
+    tag.span(label_text, class: label_classes)
+  end
+
+  def title_classes
+    class_names(
+      %(govuk-pagination__link-title),
+      %(govuk-pagination__link-title--decorated) => label_text.blank?
+    )
+  end
+
+  def label_classes
+    %w(govuk-pagination__link-label)
+  end
+end

data/app/components/govuk_component/pagination_component/item.rb

@@ -0,0 +1,77 @@
+class GovukComponent::PaginationComponent::Item < GovukComponent::Base
+  attr_reader :number, :href, :visually_hidden_text, :mode
+
+  def initialize(number: nil, href: nil, current: false, ellipsis: false, from_pagy: false, visually_hidden_text: nil, classes: [], html_attributes: {})
+    @number               = number
+    @href                 = href
+    @visually_hidden_text = visually_hidden_text
+
+    # We have three modes for rendering links:
+    #
+    #  * link    (a link to another page)
+    #  * current (a link to the current page)
+    #  * gap     (an ellipsis symbol)
+    #
+    # Pagy sets these by object type:
+    # Integer = link
+    # String  = current
+    # :gap    = gap
+    #
+    # The original Nunjucks component has two boolean settings instead,
+    # ellipsis and current. When ellipsis is true all other arguments are
+    # ignored
+    @mode = from_pagy ? pagy_mode(number) : manual_mode(ellipsis, current)
+
+    super(classes: classes, html_attributes: html_attributes)
+  end
+
+  def call
+    case mode
+    when :link
+      link(current: false)
+    when :current
+      link(current: true)
+    when :gap
+      ellipsis_item
+    end
+  end
+
+private
+
+  def pagy_mode(number)
+    return :link    if number.is_a?(Integer)
+    return :current if number.is_a?(String)
+
+    :gap
+  end
+
+  def manual_mode(ellipsis, current)
+    return :gap     if ellipsis
+    return :current if current
+
+    :link
+  end
+
+  def link(current: false)
+    attributes = html_attributes.tap { |ha| ha[:class] << "govuk-pagination__item--current" if current }
+
+    tag.li(**attributes) do
+      tag.a(href: href, class: %w(govuk-link govuk-pagination__link)) { number.to_s }
+    end
+  end
+
+  def ellipsis_item
+    tag.li("⋯", class: %w(govuk-pagination__item govuk-pagination__item--ellipses))
+  end
+
+  def default_attributes
+    {
+      class: %w(govuk-pagination__item),
+      aria: { label: aria_label }
+    }
+  end
+
+  def aria_label
+    visually_hidden_text || "Page #{number}"
+  end
+end

data/app/components/govuk_component/pagination_component/next_page.rb

@@ -0,0 +1,32 @@
+class GovukComponent::PaginationComponent::NextPage < GovukComponent::PaginationComponent::AdjacentPage
+  def initialize(href:, text:, label_text: nil, visually_hidden_text: nil, block_mode: true, classes: [], html_attributes: {})
+    super(
+      suffix: "next",
+      text: text,
+      href: href,
+      label_text: label_text,
+      block_mode: block_mode,
+      visually_hidden_text: visually_hidden_text,
+      classes: classes,
+      html_attributes: html_attributes
+    )
+  end
+
+  def body
+    return [arrow, title_span] if block_mode?
+
+    [title_span, arrow]
+  end
+
+private
+
+  def aria_label
+    @visually_hidden_text || "Next page"
+  end
+
+  def arrow
+    tag.svg(class: "govuk-pagination__icon govuk-pagination__icon--next", xmlns: "http://www.w3.org/2000/svg", height: "13", width: "15", focusable: "false", viewBox: "0 0 15 13", aria: { hidden: "true" }) do
+      tag.path(d: "m8.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z")
+    end
+  end
+end

data/app/components/govuk_component/pagination_component/previous_page.rb

@@ -0,0 +1,26 @@
+class GovukComponent::PaginationComponent::PreviousPage < GovukComponent::PaginationComponent::AdjacentPage
+  def initialize(href:, text:, label_text: nil, visually_hidden_text: nil, block_mode: true, classes: [], html_attributes: {})
+    super(
+      suffix: "prev",
+      text: text,
+      href: href,
+      label_text: label_text,
+      block_mode: block_mode,
+      visually_hidden_text: visually_hidden_text,
+      classes: classes,
+      html_attributes: html_attributes
+    )
+  end
+
+private
+
+  def aria_label
+    @visually_hidden_text || "Previous page"
+  end
+
+  def arrow
+    tag.svg(class: "govuk-pagination__icon govuk-pagination__icon--prev", xmlns: "http://www.w3.org/2000/svg", height: "13", width: "15", focusable: "false", viewBox: "0 0 15 13", aria: { hidden: "true" }) do
+      tag.path(d: "m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z")
+    end
+  end
+end

data/app/components/govuk_component/pagination_component.rb

@@ -0,0 +1,121 @@
+class GovukComponent::PaginationComponent < GovukComponent::Base
+  include Pagy::UrlHelpers
+
+  attr_reader :pagy,
+              :next_text,
+              :previous_text,
+              :visually_hidden_next_text,
+              :visually_hidden_previous_text,
+              :page_items,
+              :previous_content,
+              :next_content,
+              :block_mode,
+              :landmark_label
+
+  alias_method :block_mode?, :block_mode
+
+  renders_many :items, "GovukComponent::PaginationComponent::Item"
+
+  renders_one :next_page, ->(href:, text: default_next_text, label_text: nil, visually_hidden_text: nil, classes: [], html_attributes: {}) do
+    GovukComponent::PaginationComponent::NextPage.new(
+      text: text,
+      href: href,
+      label_text: label_text,
+      block_mode: block_mode?,
+      visually_hidden_text: visually_hidden_text,
+      classes: classes,
+      html_attributes: html_attributes
+    )
+  end
+
+  renders_one :previous_page, ->(href:, text: default_previous_text, label_text: nil, visually_hidden_text: nil, classes: [], html_attributes: {}) do
+    GovukComponent::PaginationComponent::PreviousPage.new(
+      text: text,
+      href: href,
+      label_text: label_text,
+      block_mode: block_mode?,
+      visually_hidden_text: visually_hidden_text,
+      classes: classes,
+      html_attributes: html_attributes
+    )
+  end
+
+  def initialize(pagy: nil, next_text: nil, previous_text: nil, visually_hidden_next_text: nil, visually_hidden_previous_text: nil, block_mode: false, landmark_label: "results", classes: [], html_attributes: {})
+    @pagy                          = pagy
+    @next_text                     = next_text
+    @previous_text                 = previous_text
+    @visually_hidden_next_text     = visually_hidden_next_text
+    @visually_hidden_previous_text = visually_hidden_previous_text
+    @block_mode                    = block_mode
+    @landmark_label                = landmark_label
+
+    build_items if pagy.present?
+
+    super(classes: classes, html_attributes: html_attributes)
+  end
+
+  def before_render
+    @page_items       = items || build_items
+    @previous_content = previous_page || build_previous
+    @next_content     = next_page || build_next
+  end
+
+  def call
+    attributes = html_attributes.tap { |ha| (ha[:class] << "govuk-pagination--block") if items.empty? }
+
+    tag.nav(**attributes) do
+      safe_join([
+        previous_content,
+        tag.ul(class: "govuk-pagination__list") { safe_join(page_items) },
+        next_content
+      ])
+    end
+  end
+
+  def render?
+    # probably isn't any point rendering if there's only one page
+    (pagy.present? && pagy.series.size > 1) || @previous_content.present? || @next_content.present?
+  end
+
+private
+
+  def default_attributes
+    { role: "navigation", aria: { label: landmark_label }, class: %w(govuk-pagination) }
+  end
+
+  def build_previous
+    return unless pagy&.prev
+
+    kwargs = {
+      href: pagy_url_for(pagy, pagy.prev),
+      text: @previous_text,
+      visually_hidden_text: visually_hidden_previous_text,
+    }
+
+    previous_page(**kwargs.compact)
+  end
+
+  def build_next
+    return unless pagy&.next
+
+    kwargs = {
+      href: pagy_url_for(pagy, pagy.next),
+      text: @next_text,
+      visually_hidden_text: visually_hidden_next_text,
+    }
+
+    next_page(**kwargs.compact)
+  end
+
+  def build_items
+    pagy.series.map { |i| item(number: i, href: pagy_url_for(pagy, i), from_pagy: true) }
+  end
+
+  def default_next_text
+    safe_join(["Next", tag.span(class: "govuk-visually-hidden") { " page" }])
+  end
+
+  def default_previous_text
+    safe_join(["Previous", tag.span(class: "govuk-visually-hidden") { " page" }])
+  end
+end

data/app/components/govuk_component/panel_component.rb

@@ -4,24 +4,24 @@ class GovukComponent::PanelComponent < GovukComponent::Base
   renders_one :title_html
 
   def initialize(title_text: nil, text: nil, heading_level: 1, id: nil, classes: [], html_attributes: {})
-    super(classes: classes, html_attributes: html_attributes)
-
     @heading_level = heading_level
     @title_text    = title_text
     @text          = text
     @id            = id
+
+    super(classes: classes, html_attributes: html_attributes)
   end
 
   def call
-    tag.div(id: id, class: classes, **html_attributes) do
+    tag.div(id: id, **html_attributes) do
       safe_join([panel_title, panel_body].compact)
     end
   end
 
 private
 
-  def default_classes
-    %w(govuk-panel govuk-panel--confirmation)
+  def default_attributes
+    { class: %w(govuk-panel govuk-panel--confirmation) }
   end
 
   def heading_tag

data/app/components/govuk_component/phase_banner_component.html.erb

@@ -1,4 +1,4 @@
-<%= tag.div(class: classes, **html_attributes) do %>
+<%= tag.div(**html_attributes) do %>
   <p class="govuk-phase-banner__content">
     <%= render(phase_tag_component) %>
     <%= tag.span((content.presence || @text), class: "govuk-phase-banner__text") %>

data/app/components/govuk_component/phase_banner_component.rb

@@ -2,10 +2,10 @@ class GovukComponent::PhaseBannerComponent < GovukComponent::Base
   attr_reader :text, :phase_tag
 
   def initialize(tag: nil, text: nil, classes: [], html_attributes: {})
-    super(classes: classes, html_attributes: html_attributes)
-
     @phase_tag = tag
     @text      = text
+
+    super(classes: classes, html_attributes: html_attributes)
   end
 
   def phase_tag_component
@@ -14,7 +14,7 @@ class GovukComponent::PhaseBannerComponent < GovukComponent::Base
 
 private
 
-  def default_classes
-    %w(govuk-phase-banner)
+  def default_attributes
+    { class: %w(govuk-phase-banner) }
   end
 end

data/app/components/govuk_component/section_break_component.rb

@@ -0,0 +1,44 @@
+class GovukComponent::SectionBreakComponent < GovukComponent::Base
+  SIZES = %w(m l xl).freeze
+
+  def initialize(visible: false, size: nil, classes: [], html_attributes: {})
+    @visible = visible
+    @size    = size
+
+    super(classes: classes, html_attributes: html_attributes)
+  end
+
+  def call
+    tag.hr(**html_attributes)
+  end
+
+private
+
+  attr_reader :size, :visible
+
+  def default_attributes
+    { class: default_classes }
+  end
+
+  def default_classes
+    class_names(
+      "govuk-section-break",
+      size_class,
+      "govuk-section-break--visible" => visible?
+    ).split
+  end
+
+  def size_class
+    if size.blank?
+      ""
+    elsif size.in?(SIZES)
+      "govuk-section-break--#{size}"
+    else
+      raise ArgumentError, "invalid size #{size}, supported sizes are #{SIZES.to_sentence}"
+    end
+  end
+
+  def visible?
+    visible
+  end
+end

data/app/components/govuk_component/start_button_component.rb

@@ -1,15 +1,21 @@
 class GovukComponent::StartButtonComponent < GovukComponent::Base
+  BUTTON_ATTRIBUTES = {
+    role: 'button',
+    draggable: 'false',
+    data: { module: 'govuk-button' }
+  }.freeze
+
   attr_reader :text, :href
 
   def initialize(text:, href:, classes: [], html_attributes: {})
-    super(classes: classes, html_attributes: html_attributes)
-
     @text = text
     @href = href
+
+    super(classes: classes, html_attributes: html_attributes)
   end
 
   def call
-    link_to(href, **default_attributes, **html_attributes) do
+    link_to(href, **html_attributes) do
       safe_join([text, icon])
     end
   end
@@ -17,20 +23,17 @@ class GovukComponent::StartButtonComponent < GovukComponent::Base
 private
 
   def default_attributes
-    {
-      role: 'button',
-      draggable: 'false',
-      class: classes,
-      data: { module: 'govuk-button' }
-    }
+    BUTTON_ATTRIBUTES.merge({ class: %w(govuk-button govuk-button--start) })
   end
 
-  def default_classes
-    %w(govuk-button govuk-button--start)
+  def icon
+    tag.svg(**svg_attributes) do
+      tag.path(fill: "currentColor", d: "M0 0h13l20 20-20 20H0l20-20z")
+    end
   end
 
-  def icon
-    svg_attributes = {
+  def svg_attributes
+    {
       class: "govuk-button__start-icon",
       xmlns: "http://www.w3.org/2000/svg",
       width: "17.5",
@@ -39,9 +42,5 @@ private
       focusable: "false",
       aria: { hidden: "true" }
     }
-
-    tag.svg(**svg_attributes) do
-      tag.path(fill: "currentColor", d: "M0 0h13l20 20-20 20H0l20-20z")
-    end
   end
 end

data/app/components/govuk_component/summary_list_component/action_component.rb

@@ -14,15 +14,19 @@ class GovukComponent::SummaryListComponent::ActionComponent < GovukComponent::Ba
   end
 
   def call
-    link_classes = govuk_link_classes.append(classes).flatten
-
-    link_to(href, class: link_classes, **html_attributes) do
+    link_to(href, **html_attributes) do
       safe_join([action_text, visually_hidden_span].compact, " ")
     end
   end
 
 private
 
+  def default_attributes
+    link_classes = govuk_link_classes.append(classes).flatten
+
+    { class: link_classes }
+  end
+
   def action_text
     content || text || fail(ArgumentError, "no text or content")
   end

data/app/components/govuk_component/summary_list_component/key_component.rb

@@ -2,19 +2,19 @@ class GovukComponent::SummaryListComponent::KeyComponent < GovukComponent::Base
   attr_reader :text
 
   def initialize(text: nil, classes: [], html_attributes: {})
-    super(classes: classes, html_attributes: html_attributes)
-
     @text = text
+
+    super(classes: classes, html_attributes: html_attributes)
   end
 
   def call
-    tag.dt(key_content, class: classes, **html_attributes)
+    tag.dt(key_content, **html_attributes)
   end
 
 private
 
-  def default_classes
-    %w(govuk-summary-list__key)
+  def default_attributes
+    { class: %w(govuk-summary-list__key) }
   end
 
   def key_content

data/app/components/govuk_component/summary_list_component/row_component.rb

@@ -6,17 +6,23 @@ class GovukComponent::SummaryListComponent::RowComponent < GovukComponent::Base
   renders_many :actions, GovukComponent::SummaryListComponent::ActionComponent
 
   def initialize(show_actions_column: nil, classes: [], html_attributes: {})
-    super(classes: classes, html_attributes: html_attributes)
-
     @show_actions_column = show_actions_column
+
+    super(classes: classes, html_attributes: html_attributes)
   end
 
   def call
-    tag.div(class: classes, **html_attributes) do
+    tag.div(**html_attributes) do
       safe_join([key, value, actions_content])
     end
   end
 
+  def before_render
+    if show_actions_column && actions.none?
+      html_attributes[:class] << no_actions_class
+    end
+  end
+
 private
 
   def actions_content
@@ -37,13 +43,15 @@ private
     end
   end
 
-  def default_classes
-    %w(govuk-summary-list__row).tap do |c|
-      c << "govuk-summary-list__row--no-actions" if show_actions_column && actions.none?
-    end
+  def default_attributes
+    { class: %w(govuk-summary-list__row) }
   end
 
   def actions_class
     "govuk-summary-list__actions"
   end
+
+  def no_actions_class
+    "govuk-summary-list__row--no-actions"
+  end
 end

data/app/components/govuk_component/summary_list_component/value_component.rb

@@ -8,13 +8,13 @@ class GovukComponent::SummaryListComponent::ValueComponent < GovukComponent::Bas
   end
 
   def call
-    tag.dd(value_content, class: classes, **html_attributes)
+    tag.dd(value_content, **html_attributes)
   end
 
 private
 
-  def default_classes
-    %w(govuk-summary-list__value)
+  def default_attributes
+    { class: %w(govuk-summary-list__value) }
   end
 
   def value_content

data/app/components/govuk_component/summary_list_component.html.erb

@@ -1,4 +1,4 @@
-<%= tag.dl(class: classes, **html_attributes) do %>
+<%= tag.dl(**html_attributes) do %>
   <% rows.each do |row| %>
     <%= row %>
   <% end %>

data/app/components/govuk_component/summary_list_component.rb

@@ -12,28 +12,24 @@ module GovukComponent
     end
 
     def initialize(rows: nil, actions: true, borders: true, classes: [], html_attributes: {})
-      super(classes: classes, html_attributes: html_attributes)
-
       @borders             = borders
       @show_actions_column = actions
 
+      super(classes: classes, html_attributes: html_attributes)
+
       return unless rows.presence
 
       build(rows)
     end
 
-    def classes
-      super.append(borders_class).compact
-    end
-
   private
 
     def borders_class
       %(govuk-summary-list--no-border) unless borders
     end
 
-    def default_classes
-      %w(govuk-summary-list)
+    def default_attributes
+      { class: ["govuk-summary-list", borders_class].compact }
     end
 
     def build(rows)

data/app/components/govuk_component/tab_component.html.erb

@@ -1,4 +1,4 @@
-<%= tag.div(id: id, class: classes, data: { module: 'govuk-tabs' }, **html_attributes) do %>
+<%= tag.div(**html_attributes) do %>
   <%= tag.h2(title, class: "govuk-tabs__title") %>
   <ul class="govuk-tabs__list">
     <% tabs.each.with_index do |tab, i| %>
@@ -6,6 +6,6 @@
     <% end %>
   </ul>
   <% tabs.each.with_index do |tab, i| %>
-    <%= tag.div(tab, class: tab.classes.append(tab.hidden_class(i)), id: tab.id, **tab.html_attributes) %>
+    <%= tag.div(tab, **tab.combined_attributes(i)) %>
   <% end %>
 <% end %>